[jQuery] Annoying IE Flash

[jhm]

I get an annoying flash in IE when I go to a page. I'm wondering if
there is a good way around it.

It's my 2nd & 3rd level navigation. I have a collapsing menu that is
intended to only show the 3rd level nav once its corresponding 2nd
level is selected. In case javascript is turned off, I have them all
visible in my markup, and then hide them on page load. In IE, it shows
the expanded menu first then hides them, thus the annoying flash.

Here's the code:

  $(document).ready( function() {
    $('.nav3').hide();
    $('.nav2 li a').removeClass('selected');
    $('.nav2 li a:first').addClass('selected');
  });

Here's the markup:

  <div class="nav2">
    <ul>
      <li>
        <a href="#">Menu One</a>
      </li>
      <li>
        <a href="#">Menu Two</a>
        <ul class="nav3">
          <li><a href="#">One</a></li>
          <li><a class="last" href="#">Two</a></li>
        </ul>
      </li>
      <li>
        <a href="#">Menu Three</a>
      </li>
      <li>
        <a href="#">Menu Four</a>
        <ul class="nav3">
          <li><a href="#">One</a></li>
          <li><a class="last" href="#">Two</a></li>
        </ul>
      </li>
      <li>
        <a href="#">Menu Five</a>
      </li>
    </ul>
  </div>

Anyone see how I could do this better and eliminate the flash?

Thanks!