Jquery show hide single link menu-unable to hide on mouse out
<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;script src="jquery.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
    $(document).ready(function() {
        $(".link").click(function(){
            $(".myList").show();
            $(".link1").click(function(){
                $(".myList").hide();
            });
        });
    });
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div class="myDiv"&gt; &lt;a href="#." class="link"&gt;Text&lt;/a&gt;
&lt;div class="mylist" style="display:none;"&gt; &lt;a href="#." class="link1"&gt;Text&lt;/a&gt; &lt;a href="#." class="link1"&gt;Text&lt;/a&gt; &lt;a href="#."class="link1"&gt;Text&lt;/a&gt; &lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>I want to hide list panel on mouse out, currently I am able to hide it on clicking on any link but want it on mouse out too...</p>
