CODEWITHSUNDEEP
jqueryhtmlcss
idontknowhow
idontknowhow

Reputation: 1527

Hide not first child from every class parent

Here with my html and jQuery code

<div class="tabbed">
    <h2>Title</h2>
    <div class="tabs"></div> <!-- want to show then hide rest -->
    <h2>Title</h2>
    <div class="tabs"></div>
    <h2>Title</h2>
    <div class="tabs"></div>
</div>
<div class="tabbed">
    <h2>Title</h2>
    <div class="tabs"></div> <!-- want to show then hide rest -->
    <h2>Title</h2>
    <div class="tabs"></div>
    <h2>Title</h2>
    <div class="tabs"></div>
    <h2>Title</h2>
    <div class="tabs"></div>
</div>
<div class="tabbed">
    <h2>Title</h2>
    <div class="tabs"></div> <!-- want to show then hide rest -->
    <h2>Title</h2>
    <div class="tabs"></div>
    <h2>Title</h2>
    <div class="tabs"></div>
    <h2>Title</h2> 
    <div class="tabs"></div>
</div>

jQuery

$(".tabbed > .tabs:not(:first)").hide();

Upvotes: 0

Views: 107

Answers (1)

Fabr&#237;cio Matt&#233;
Fabr&#237;cio Matt&#233;

Reputation: 70139

Updated answer to match your new question code:

$(".tabbed").find('.tabs:not(:first)').hide();

Fiddle

The above may not look "right" as one would assume that :first would return only 1 element, but it has the same effect as this more verbose and CPU-consuming form:

$(".tabbed").each(function() {
    $(this).find('.tabs:not(:first)').hide();
});

Fiddle

I assume the .find() method does the iteration internally before executing the selector for each element in the set of matched elements, so the latter code snippet is unnecessary. However, you can use the more verbose and bulletproof form if you ever encounter problems when upgrading or downgrading jQuery in the future.

Upvotes: 1

Related Questions