JQuery Menu - Select Item by Default
<p>I am using JQuery to create a navigation structure on my web site. This structure is defined by the following code:</p>

<pre><code>&lt;ul id="theMenu"&gt; 
  &lt;li&gt;&lt;a title="" href="#"&gt;&lt;img alt="Home" src="/dot.png" class="menuHeader" /&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a title="" href="#"&gt;&lt;img alt="About" src="/dot.png" class="menuHeader" /&gt;About&lt;/a&gt; 
    &lt;ul&gt; 
      &lt;li&gt;&lt;a href="#"&gt;&lt;img alt="Our Team" src="/dot.png" class="subMenuHeader" /&gt;Our Team&lt;/a&gt;&lt;/li&gt; 
      &lt;li&gt;&lt;a href="#"&gt;&lt;img alt="Our Company" src="/dot.png" class="subMenuHeader" /&gt;Our Process&lt;/a&gt;&lt;/li&gt; 
    &lt;/ul&gt; 
  &lt;/li&gt; 
  &lt;li&gt;&lt;a title="" href="#"&gt;&lt;img alt="Catalog" src="/dot.png" class="menuHeader" /&gt;Catalog&lt;/a&gt; 
    &lt;ul&gt; 
     &lt;li&gt;&lt;a href="#"&gt;&lt;img alt="" src="/dot.png" class="subMenuHeader" /&gt;Men's Clothing&lt;/a&gt;&lt;/li&gt;  
     &lt;li&gt;&lt;a href="#"&gt;&lt;img alt="" src="/dot.png" class="subMenuHeader" /&gt;Women's Cloting&lt;/a&gt;&lt;/li&gt; 
  &lt;li&gt;&lt;a href="#"&gt;&lt;img alt="" src="/dot.png" class="subMenuHeader" /&gt;Kids Clothing&lt;/a&gt;&lt;/li&gt; 
  &lt;/ul&gt; 
  &lt;/li&gt; 
  &lt;li&gt;&lt;a title="Contact Us" href="#" class="btm"&gt;&lt;img alt="Contact Us" src="/dot.png" class="menuHeader" /&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;script type="text/javascript"&gt;
  $(document).ready(function () {
    $("#theMenu &gt; li &gt; a").not(":first").find("+ ul").slideUp(1);
    $("#theMenu &gt; li &gt; a").click(function () {
      $(this).find("+ ul").slideToggle("fast");
    });
  });
&lt;/script&gt;
</code></pre>

<p>In some situations, I want to pre-select one of the menu items. Let's pretend that I wanted the "Catalog" menu pre-selected (expanded). How would I do this via JQuery?</p>

<p>Thank you!</p>
