Child div closing when clicking on a link
<p>I'm trying to create a horizontal clickable menu using jquery for an intranet.  Everything works fine until you click on one of the links of the child div - this just makes the whole div disappear again.  This is my first attempt so I hope I've explained this ok, I'd really appreciate some help.</p>

<p>script:</p>

<pre><code>$(function(){ 
    $("#nav1").click(function(event) {
        event.preventDefault();
        $("#teams").slideToggle();
    });
    $("#teams a").click(function(event) {
        event.preventDefault();
        $("#teams").slideUp();
    });
});
</code></pre>

<p>html:</p>

<pre><code>&lt;div id="nav1outer"&gt;
  &lt;a href="#" id="nav1"&gt; Link 1&lt;/a&gt;
  &lt;div id="teams"&gt; 
    &lt;ul&gt;
      &lt;li&gt;&lt;a href="http://child1.com"&gt;Child 1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="http://child2.com"&gt;Child 2&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="http://child3.com"&gt;Child 3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Many thanks
Jayne</p>
