Toggle effect not working in UL LI
<p>I have this menu item with a submenu. The submenu has five itens and I used jQuery to toggle it down. The problem is that only the first item of the submenu is toggling. Here's the code:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function () {
        $("ul.menu-body li:even").addClass("alt");
        $('img.menu-head').hover(function () {
            $('ul.menu-body').slideToggle('slow');
        }); 
    });
&lt;/script&gt;

&lt;ul&gt;
    ...
    &lt;li id="menu-03"&gt;
        &lt;a href="galeria_representacao.php?image=0"&gt;&lt;img src="images/representacao.jpg" class="menu-head" onMouseOver="this.src='images/representacao-hover.jpg'" onMouseOut="this.src='images/representacao.jpg'" /&gt;&lt;/a&gt;  
        &lt;ul class="menu-body"&gt;
            &lt;li&gt;&lt;a href="galeria_representacao.php?image=0"&gt;Dixtal&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="galeria_philips.php?image=0"&gt;Philips&lt;/a&gt;&lt;/li&gt;          
            &lt;li&gt;&lt;a href="galeria_biosensor.php?image=0"&gt;BioSensor&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="galeria_biorad.php"&gt;BioRad&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="galeria_leica.php?image=0"&gt;Leica&lt;/a&gt;&lt;/li&gt;   
        &lt;/ul&gt;
    &lt;/li&gt; 
    ...
&lt;/ul&gt;
</code></pre>
