javascript dropdown
<p>I am not sure what I am missing here.  this is the code I have placed:</p>

<pre><code>       &lt;script type="text/javascript"&gt;
    $(function(){
        $(".category_list").hide(); return false;
        $("#sol-surface").click( function() {
         $(this).next().toggle();
         return false;
        });
        $("#nat-stone").click( function() {
         $(this).next().toggle();
         return false;
        });
        $("#man-surface").click( function() {
         $(this).next().toggle();
         return false;
        });
    });

&lt;/script&gt;
</code></pre>

<p>and while it is hiding the submenu, it is also not coming up when I click on the item - this is what comes up when I look at the page source:</p>

<pre><code>    &lt;div class="cat_nav"&gt;
    &lt;ul&gt;
     &lt;li&gt;&lt;a href="#" id="sol-surface"&gt;Solid Surface&lt;/a&gt;&lt;/li&gt;

     &lt;li&gt;&lt;a href="#" id="nat-stone"&gt;Natural Stone&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="#" id="man-surface"&gt;Manufactured Surface&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
    &lt;div id="sub-nav"&gt;
    &lt;ul class="category_list"&gt;
    &lt;li&gt;&lt;a href="http://www.metrostoneworks.com/products/?c=corian"&gt;Corian&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
    &lt;ul class="category_list"&gt;

    &lt;li&gt;&lt;a href="http://www.metrostoneworks.com/products/?c=granite"&gt;Granite&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="http://www.metrostoneworks.com/products/?c=silestone"&gt;Silestone&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
    &lt;ul class="category_list"&gt;
    &lt;li&gt;&lt;a href="http://www.metrostoneworks.com/products/?c=zodiaq"&gt;Zodiaq&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
    &lt;/div&gt; &lt;!-- EO #sub-nav --&gt;
&lt;/div&gt; &lt;!-- EO .cat_nav --&gt;
</code></pre>

<p>and I am not sure why I cannot get to the submenu...thanks</p>
