Only toggle certain elements based on class

Casey Crookston

I have a simple table:

<table>
    <tr class="header">
        <th>
            ....
        </th>
    </tr>
    <tr class="level2">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level2">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
</table>

This works great to toggle everything from one "header" to the next.

$('.header').click(function () {
    $(this).nextUntil('tr.header').toggle();
});

But what I can't figure out how to do is to ONLY toggle the elements with class of "level2" and leave "level3" hidden.

I've been playing around for a while with .toggleClass() and .netAll() but I am not getting it.

epascarello

Use filter to select the items

$('.header').click(function () {
    var trs = $(this).nextUntil('tr.header')
    trs.filter('.level2').toggle();
    trs.filter('.level3').hide();
});

.header {
  background-color: green;
}

.level2 {
  background-color: yellow;
}

.level3 {
  background-color: blue;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
    <tr class="header">
        <th>
            ....
        </th>
    </tr>
    <tr class="level2">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level2">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
    <tr class="level3">
        <th>
            ....
        </th>
    </tr>
</table>

Collected from the Internet

Please contact [email protected] to delete if infringement.