:first.click for multiple uls
<p>Well, im working on a lightweight simple dropdown. And I came out with this little problem:</p>

<pre><code>&lt;script&gt;
$(document).ready(function () {
$('ul li:first a').click(function () {
    if ($(this).attr('class') != 'active') {
        $('.hideContent').slideUp(300);
        $('.showContent').removeClass('active');
        $(this).addClass('active').next('ul').slideDown(300);
        event.stopPropagation();
    }
    else {
        $(this).removeClass('active');          
        $('.hideContent').slideUp();
    }       
});
});
&lt;/script&gt;
</code></pre>

<p>The :first is only triggering for the first ul. Im working with multiple uls right now:</p>

<pre><code>    &lt;ul&gt;
    &lt;li&gt;&lt;a href="#"&gt;&lt;span class="plus"&gt;+&lt;/span&gt;&lt;span class="minus"&gt;-&lt;/span&gt;Administração&lt;/a&gt;
        &lt;ul class="hideContent"&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
&lt;/ul&gt;
    &lt;ul&gt;
    &lt;li&gt;&lt;a href="#"&gt;&lt;span class="plus"&gt;+&lt;/span&gt;&lt;span class="minus"&gt;-&lt;/span&gt;Administração&lt;/a&gt;
        &lt;ul class="hideContent"&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Item&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>The :first shouldnt trigger the first li of EACH ul? Or am I working the wrong way around?</p>

<p>Thanks in advance.</p>
