JQuery - find first sibling matches selector

jquery next siblings
yossi picture yossi · May 14, 2014 · Viewed 13.5k times · Source

How can i get the first (next) element in the list that matches the selector ?

Example:

<table>
  <tr class="test"><td>not this one</td></tr>
  <tr><td><a title="test">click</a></td></tr>
  <tr><td>not this one</td></tr>
  <tr class="test"><td>this one</td></tr>
  <tr class="test"><td>ignore this as well</td></tr>
</table>

$("a").on('click', function(eve){
  $(this).parents("tr").???(".test").toggle();
});

edit

I need the following row. siblings gets others as well (like the first row)

Answer

Unknown picture Unknown · May 14, 2014

Use .nextAll() to get following siblings of an element and :first to get first matched element.

Try this:

$("a").on('click', function(eve){
  $(this).parents("tr").nextAll(".test:first").toggle();
});

DEMO

Related questions

JQuery next() - Getting the next sibling using only classes

I'm trying to create something like a web accordion. Visual example: [TITLE DIV 1] [CONTENT DIV 1] [TITLE DIV 2] [CONTENT DIV 2] [TITLE DIV 3] [CONTENT DIV 3] I want to be able to toggle (jquery function toggle()) a "Content Div" by clicking on the …

Read More
jQuery to find nearest Div of Parent

I am trying to learn jQuery with the following scenario. For this, I tried the following jQuery after reading multiple SO questions; but it did not work $(this).closest('.viewLogText').parent().find('.reportLog').css("display", "none"); Scenario: There …

Read More
jquery, find next element by class

How can i find the next element by class. i tried with $(obj).next('.class'); but this returns classes only in $(obj) parent. I need to take the next element anywhere throughout the code by class name. Because my …

Read More