jQuery nested ul drop down menu
<p>I have a simple ul menu <a href="http://www.ttmt.org.uk/forum/nav/index1.html" rel="nofollow">here</a> with nested ul's</p>

<p>I want the nested menu to slide down when the link is clicked 
and slide up again on the second click. This is working.</p>

<p>I also need any other open nested menus to close when another link is clicked.
This isn't working.</p>

<p>I tried to use this to close any open nested menus before I open the nested menu I want
but this also closes the nested menu when a link in the nested menu is clicked.</p>

<pre><code>$(document).ready(function () {
    $('#nav ul.children').slideUp();
    $('#nav li').click(function (e) {
        $('ul.children').slideUp();
        $('ul', this).slideToggle();
        e.stopPropagation();
    });
});
</code></pre>

<p><a href="http://www.ttmt.org.uk/forum/nav/index2.html" rel="nofollow">http://www.ttmt.org.uk/forum/nav/index2.html</a></p>

<p>How can I slideToggle the nested menus when it's parent is clicked and close any open nested menus when another link is clicked.</p>

<pre><code>&lt;ul id="nav"&gt;
   &lt;li&gt;&lt;a href="#"&gt;One&lt;/a&gt;
     &lt;ul class="children"&gt;
        &lt;li&gt;&lt;a href="http://www.google.com"&gt;One/One&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="http://www.bbc.com"&gt;One/Two&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;One/Three&lt;/a&gt;&lt;/li&gt;
     &lt;/ul&gt;
   &lt;/li&gt;
   &lt;li&gt;&lt;a href="#"&gt;Two&lt;/a&gt;&lt;/li&gt;
   &lt;li&gt;&lt;a href="#"&gt;Three&lt;/a&gt;
     &lt;ul class="children"&gt;
        &lt;li&gt;&lt;a href="#"&gt;Three/One&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Three/Two&lt;/a&gt;&lt;/li&gt;
     &lt;/ul&gt;
   &lt;/li&gt;  
 &lt;/ul&gt;
</code></pre>

<p></p>

<pre><code> $(document).ready(function(){
   $('#nav ul.children').slideUp();
   $('#nav li').click(function(e){
     //$('ul.children').slideUp();
     $('ul', this).slideToggle();
     e.stopPropagation();
   });
 });
</code></pre>

<p></p>

<p><strong>EDIT</strong></p>

<p>I have another major problem with my code, because I close the nested ul at the start with</p>

<pre><code>$('#nav ul.children').slideUp();
</code></pre>

<p>When a link is clicked and the page reloads the all the menus are closed.
How can I keep the nested menu open when the page reloads.</p>
