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

javascript, jquery

Solution

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>

Problem

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?

Original source