Animate opacity not working
<p>I had a little jQuery dropdown menu that worked when I used <a href="http://api.jquery.com/fadeIn" rel="nofollow"><code>fadeIn</code></a> and <a href="http://api.jquery.com/fadeOut" rel="nofollow"><code>fadeOut</code></a> just fine, so the selectors and the HTML are fine.</p>

<p>However, the <code>fadeIn</code> gives some ugly behavior in IE.  I changed the menu to animate the opacity instead of the <code>fadeIn</code> using template code I found here. The only problem is it's not working; Any hints?</p>

<pre><code>$(document).ready(function() {

    $("#nav li").hover(
        function () {
        $(this).children("ul").animate({"opacity": 1});
        },function(){
        $(this).children("ul").animate({"opacity": 0});
    });//hover

});// document ready
</code></pre>

<p>HTML</p>

<pre><code>&lt;input type="hidden" name="arav" /&gt;&lt;ul id="nav"&gt; 
&lt;li&gt; &lt;a href="index2.html"&gt;Home&lt;/a&gt; 
&lt;/li&gt; 
&lt;li&gt; &lt;a href="personnel.html"&gt;Who We Are&lt;/a&gt; 
&lt;/li&gt; 
&lt;li&gt; &lt;a href="#"&gt;Facts&lt;/a&gt; 
&lt;ul&gt; 
&lt;li&gt;&lt;a href="sci.html"&gt;Sci&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="tbi.html"&gt;Tbi&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="stroke.html"&gt;Str&lt;/a&gt;&lt;/li&gt; 
&lt;/ul&gt; 
&lt;/li&gt; 
&lt;li&gt; &lt;a href=""&gt;Education&lt;/a&gt; 
&lt;ul&gt; 
&lt;li&gt;&lt;a href="healthed.html"&gt;Health Education&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="#"&gt;KARRN Materials&lt;/a&gt; 
&lt;ul&gt; 
&lt;li&gt;&lt;a href="handouts.html"&gt;Handouts&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="presentations.html"&gt;Presentations&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="movies.html"&gt;Movies&lt;/a&gt;&lt;/li&gt; 
&lt;/ul&gt; 
&lt;/li&gt; 

&lt;li&gt;&lt;a href="sciinfosheets.html"&gt;SCI Info Sheets&lt;/a&gt;&lt;/li&gt; 
&lt;/ul&gt; 
&lt;/li&gt; 
&lt;li&gt; &lt;a href="stroke.html"&gt;Resources&lt;/a&gt; 
&lt;ul&gt; 
&lt;li&gt;&lt;a href="statelevel.html"&gt;State Level&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="nationallevel.html"&gt;National Level&lt;/a&gt;&lt;/li&gt; 
&lt;li&gt;&lt;a href="resourcesbycoutny2.html"&gt;Community Level&lt;/a&gt;&lt;/li&gt; 
&lt;/ul&gt; 
&lt;/li&gt; 

&lt;li&gt; &lt;a href="research.html"&gt;Research&lt;/a&gt;&lt;/li&gt; 

&lt;li&gt; &lt;a href="contactus.html"&gt;Contact Us&lt;/a&gt; 
&lt;/li&gt; 
&lt;/ul&gt;
</code></pre>
