HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>jQuery .prev() — table row</title>

  <style>

    table { border-collapse: collapse; }

    td, th { border: 1px solid #ccc; padding: 8px 12px; }

    tr.selected { background: #fff3cd; }

    tr.header-row { background: #e8f4ff; font-weight: bold; }

  </style>

</head>

<body>

  <table>

    <tr class="header-row"><th>Name</th><th>Status</th></tr>

    <tr><td>Alpha</td><td>Done</td></tr>

    <tr class="selected"><td>Beta</td><td>Active</td></tr>

    <tr><td>Gamma</td><td>Pending</td></tr>

  </table>

  <p>Row above .selected gets .header-row styling via .prev().</p>

  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

  <script>

    $("tr.selected").prev().addClass("header-row");

  </script>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery .prev() — table row above (Try It)