jQuery Cross-Browser Gotcha

One of the reasons I love javascript libraries, especially jQuery, is their promise of cross-browser compatibility. Even though I know how difficult it is to get javascript functions to behave the same across multiple browsers, I am still disappointed when jQuery fails to deliver.

In short, I was doing some jQuery manipulation on a vertical navigation menu. I wanted the menu to be hidden until I was finished manipulating it, then I wanted to show the menu. So I had:

....
jQuery manipulation of menu
....
$('#menuId').css('visibility', 'visible');

Worked great in some browsers, but the jQuery manipulation did not work at all in others. The problem was the invisibility of the #menuId div. When I made the div visible before manipulating it, everything worked:

$('#menuId').css('visibility', 'visible');
....
jQuery manipulation of menu
....