Question

Given this markup:

<ul>
    <li><a class="level1 selected">1</a></li>
    <li><a class="level2">2</a></li>
    <li><a class="level2">3</a></li>
    <li><a class="level2">4</a></li>
    <li><a class="level1">1</a></li>
    <li><a class="level2">5</a></li>
    <li><a class="level2">6</a></li>
    <li><a class="level2">7</a></li>
    <li><a class="level1">1</a></li>
</ul>

How do I select the LI tags whose childred have the class level2 immediately following the LI tag whose child has the class selected ?

My initial code fails because I am not properly able to use the nextUntil() function.

// Selects the parent of the select A tag    
var selectedParent = $("ul li a.selected.level1").parents("li");

selectedParent.nextUntil("li a.level1").each(function () {
    $(this).children().addClass("on");
});

Answer 1

$lvl1 = $('a:not(.level2)').closest('li');
$lvl2 = $('a.selected').closest('li').nextUntil($lvl1);

or on a single line:

$lvl2 = $('a.selected').closest('li').nextUntil($('a:not(.level2)').closest('li'));

http://jsfiddle.net/mblase75/jKCrH/