Changing css display element after document.ready jquery

[noi172]

I am testing new menu code and one problem with it, is that it loads everything, then jumps into place when all finished loading.So what i'm trying is to hide it until the document is ready and then show itSo, CSS to hide it:\[code\]#mega-menu-1 {font: normal 13px Arial, sans-serif; list-style: none; position: relative; padding: 0; margin: 0;margin-top:13px;display: none;}\[/code\]Then I'm calling the jquery at the end of the page to load the menu, then change the display to block, but menu not displayingHere's the jquery I'm trying:\[code\]<script type="text/javascript"> $(document).ready(function($){ $('#mega-menu-1').dcMegaMenu({ rowItems: '2', event: 'click', fullWidth: false }); $('#mega-menu-1').css('display') == 'block'; });</script>\[/code\]What's the correct way to do this?