Question

I have this layout:

<div class="list">
    <ul></ul>
    <ul></ul>
</div>
<div class="list">
    <ul></ul>
    <ul></ul>
    <ul></ul>
    <ul></ul>
</div>
<div class="list">
    <ul></ul>
    <ul></ul>
</div>

I am trying to only show the first ul of every div using jQuery. I know it is possible but when using $('div.list ul:gt(1)').each(function(){$(this).hide()}); it shows the first div’s contents and hides everything else.

Answer 1

Fiddle: http://jsfiddle.net/y9bEG/3/

Use this:

$("div.list").each(function(){
    $("ul:not(:first)", this).hide();
});

It selects each div element with class list, and hides all <ul> elements which are not a first element.