jquery

Question

I can get the current row using this code. The "this" is a link in a table cell in the row.

$currentTR = $(this).parents('tr');

These next two lines can do the same thing, get the tr after the current row.

$nextTR = $(this).parents('tr').next();  
$nextTR = $(this).parents('tr').next('tr');

If I output $nextTR.html() I see what I expect

I don't know how many rows I need to go to get to the correct row except by class name and doing it like this doesn't work for me.

$nextTR = $(this).parents('tr').next('.concept');  
$nextTR = $(this).parents('tr').next('tr .concept');

All I get is null

The example on docs.Jquery link text uses this

$("p").next(".selected").css("background", "yellow");

What am I missing here?

Andy Gaskell · Accepted Answer

Give nextAll a shot. Example from the documentation:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>nextAll demo</title>
  <style>
  div {
    width: 80px;
    height: 80px;
    background: #abc;
    border: 2px solid black;
    margin: 10px;
    float: left;
  }
  div.after {
    border-color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
 
<div>first</div>
<div>sibling<div>child</div></div>
<div>sibling</div>
<div>sibling</div>
<script>
$( "div" ).first().nextAll().addClass( "after" );
</script>
 
</body>
</html>

bjelli · Answer

I've tried to recreate your html + javascript at jsbin and I can reproduce the problem:

siblings() returns all 4 rows, and I can see that two of the rows have class="concept", but next('.concept') does not return anything.

Isn't next() supposed to be a subset of siblings() ?

thanks for the comment, now I get it! I need silbings, not next.

jquery - go to next table row based on class name from current row location?

Tags:

javascript

Breadtruck

2 Answers

Andy Gaskell

bjelli

Recent Activity

Donate For Us