General questions on jQuery's .click()
<p>I am currently learning the api of Jquery. I understand Jquery has a hover function as reflected below:</p>

<pre><code>hover( handlerIn(eventObject) , handlerOut(eventObject))
</code></pre>

<p>With the second <code>handlerOut(eventObject)</code>, I can handle events like collapsing a menu tree when it is  not hovered over.</p>

<p>I then looked at the api for the click function as reflected below:</p>

<pre><code>.click( [eventData], handler(eventObject) )
</code></pre>

<p>Similar to what I want to achieve in my previous description, I have a menu tree. When a list item is clicked, it will dropdown to a submenu. My question is how do I collapse this submenu tree when I click out of the menu or click on other items?</p>

<p>lastly, I am using jquery-1.2.6.min.js to achieve this.</p>

<p>My jQuery:</p>

<pre><code> $("li.p1:has(ul)").click(function(event){
    if (this == event.target) {
    var current = this;
    $("#nav li:has(ul)").each(function() {
        if (this != current) $(this).children().slideUp(400);
    });
        $("ul:first", $(this)).slideToggle(400);
    }
    },function(){$(this).children().slideUp(400);});
</code></pre>

<p>My HTML:</p>

<pre><code>    &lt;div id="wrap"&gt;
    &lt;ul id="nav"&gt;
    &lt;li class="p1 down"&gt;Manage Subject
        &lt;ul&gt;
            &lt;li&gt;&lt;a href="#url"&gt;Add Subject&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#url"&gt;Edit Subject&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#url"&gt;Delete Subject&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#url"&gt;Export Subject&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#url"&gt;Manual Crawling&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#url"&gt;Crawl Interval&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#url"&gt;Search Parameter&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
    &lt;/div&gt;
</code></pre>
