HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>jQuery .prevUntil('hr')</title>

  <style>

    li { padding: 4px 8px; margin: 2px 0; }

    li.done { background: #d4edda; text-decoration: line-through; color: #666; }

  </style>

</head>

<body>

  <ul>

    <li>Task A</li>

    <li>Task B</li>

    <hr>

    <li>Task C</li>

    <li class="current">Task D</li>

    <li>Task E</li>

  </ul>

  <p>Tasks before the hr (from Task D) are marked done.</p>

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

  <script>

    $("li.current").prevUntil("hr").addClass("done");

  </script>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery .prevUntil('hr') — list separator (Try It)