Please help me applying jquery on this menu
<p>I have a menu as below, I want to apply slidetoggle or something like that in jquery where all the child li are hidden by default, when clicked on for example "information 1" li than show it's children, information 2 remains hidden. And if i click information 2 than children of other li hides. Please help.    </p>

<pre><code>&lt;ul id="navlist"&gt;
    &lt;li&gt;Information 1&lt;ul&gt;
        &lt;li&gt;apple1&lt;/li&gt;
        &lt;li&gt;Mango1&lt;/li&gt;
        &lt;li&gt;Banana1&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;Information 2&lt;ul&gt;
        &lt;li&gt;apple2&lt;/li&gt;
        &lt;li&gt;Mango2&lt;/li&gt;
        &lt;li&gt;Banana3&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;Information 3&lt;ul&gt;
        &lt;li&gt;apple3&lt;/li&gt;
        &lt;li&gt;Mango3&lt;/li&gt;
        &lt;li&gt;Banana3&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
</code></pre>
