.nextAll()S2C Home « Traversal « .nextAll()

All next sibling elements retrieval.

Description

The .nextAll() method is used to retrieve all following sibling of each element within the matched set.

Syntax


Signature Description
.nextAll()Retrieve all following siblings of each element within the matched set.
.nextAll( selector )Retrieve all following siblings of each element within the matched set, but only if they match the specified selector.

Parameters


Parameter Description Type
selectorA string containing a CSS or custom jQuery selector.Selector

Return

A jQuery object either containing the elements matched or empty.

.nextAll() Examplego to top of page Top

Retrieve all following siblings of each element within the matched set.

In the example below we select all following 'tr' elements within the table that come after the 'tr' element with the id of 'trid1 and then change the background colour within the matched set.

Table For Testing The .nextAll() Signature
Table Row 1, Table Data 1 Table Row 1, Table Data 2
Table Row 2 (id of trid1), Table Data 1 Table Row 2 (id of trid1), Table Data 2
Table Row 3, Table Data 1 Table Row 3, Table Data 2
Table Row 4, Table Data 1 Table Row 4, Table Data 2


$(function(){
  $('#btn7').on('click', function() {
    $('.testtable #trid1').nextAll()
                          .css('backgroundColor', 'orange');
  });
});

Press the button below to action the above code:


.nextAll( selector ) Examplego to top of page Top

Retrieve all following siblings of each element within the matched set, but only if they match the specified selector.

In the example below we select all following 'tr' elements within the table that come after the 'tr' element with the id of 'trid2. We then filter on rows with a class of 'usetr' and then change the background colour within the matched set.

Table For Testing The .nextAll( selector) Signature
Table Row 1 (id of trid2), Table Data 1 Table Row 1 (id of trid2), Table Data 2
Table Row 2 (class of usetr), Table Data 1 Table Row 2 (class of usetr), Table Data 2
Table Row 3, Table Data 1 Table Row 3, Table Data 2
Table Row 4 (class of usetr), Table Data 1 Table Row 4 (class of usetr), Table Data 2


$(function(){
  $('#btn8').on('click', function() {
    $('.testtable2 #trid2').nextAll('.usetr')
                           .css('backgroundColor', 'orange');
  });
});

Press the button below to action the above code:


go to home page Homepage go to top of page Top