Collapsible menu with jQuery
<p>I need collapsible menu with first <code>&lt;ul&gt;</code> is opened and others are closed in jQuery</p>

<pre><code>&lt;div class="accordion" id="list1b"&gt; 
  &lt;a href="/index.php/jstride/vehicle"&gt; Rides&lt;/a&gt;&lt;ul class="navigation"&gt;
&lt;li&gt;
    &lt;a class="menu_user_profile_ride_edit user_add_ride" href="/index.php/jstride/vehicle"&gt;Post My Ride&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
    &lt;a class="menu_user_profile_ride_edit user_edit_ride_new" href="/index.php/ride/recent"&gt;New Additions&lt;/a&gt;

&lt;/li&gt;
&lt;li&gt;
    &lt;a class="menu_user_profile_ride_edit user_edit_ride_popular" href="/index.php/ride/popular"&gt;Most Popular&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
    &lt;a class="menu_user_profile_ride_edit user_edit_ride_myride" href="/index.php/myride"&gt;My Rides&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
   &lt;a class="menu_user_profile_ride_edit user_ride_search" href="/index.php/advancedsearch"&gt;Search for Rides&lt;/a&gt;
&lt;/li&gt;
 &lt;/ul&gt;           
  &lt;a href="/index.php/members/browse/controller/index"&gt;Friends&lt;/a&gt;
  &lt;ul class="navigation"&gt;
    &lt;li&gt;
        &lt;a class="menu_user_edit_update user_edit_member" href="/index.php/members"&gt;Browse Members&lt;/a&gt;
    &lt;/li&gt;

    &lt;li&gt;
        &lt;a class="menu_user_edit_update user_edit_update" href="/index.php   /user/updates"&gt;View Recent Update&lt;/a&gt;
    &lt;/li&gt;
    &lt;/ul&gt;   
&lt;/div&gt;
</code></pre>

<p>When I reach the home page I need to open the rides section and the friends section should be closed. Please help me to fix this issue</p>
