Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery select siblings 'until'

I have a DOM in the form of

<input class="parent"></div>
<input class="child"></div>
<input class="child"></div>
<input class="parent"></div>
<input class="child"></div>
...

which I know is not Right and the right way to do this would be to reform the HTML, but lets say that is not possible.

How can I get jquery to select all children of one parent (that is select all .children until .parent)

like image 379
jon skulski Avatar asked Dec 02 '09 00:12

jon skulski


2 Answers

jQuery 1.4 now has the .nextUntil(selector) function:

    $('div.parent').toggle(
        function() {
            $(this).nextUntil('div.parent').hide();
         },
        function() {
            $(this).nextUntil('div.parent').show();
        }
    );
like image 105
foson Avatar answered Sep 26 '22 07:09

foson


You can iterate through the nextAll div siblings elements until you find the following .parent, check this example:

$('.parent').click(function() {
  $(this).nextAll('div').each(function() {
    if ($(this).is('.parent')) {
      return false; // next parent reached, stop
    }
    $(this).toggleClass('highlight');
  });
});

Markup used:

<div class="parent">parent 1</div>
<div class="child">child</div>
<div class="child">child</div>
<div class="parent">parent 2</div>
<div class="child">child</div>
<div class="parent">parent 3</div>
<div class="child">child</div>
<div class="child">child</div>
<div class="child">child</div>

...

like image 32
Christian C. Salvadó Avatar answered Sep 26 '22 07:09

Christian C. Salvadó