HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>jQuery .prev() vs .next()</title>

</head>

<body>

  <h3>.prev()</h3>

  <ul id="prev-demo">

    <li>1</li>

    <li>2</li>

    <li class="third-item">3</li>

    <li>4</li>

    <li>5</li>

  </ul>



  <h3>.next()</h3>

  <ul id="next-demo">

    <li>1</li>

    <li>2</li>

    <li class="third-item">3</li>

    <li>4</li>

    <li>5</li>

  </ul>



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

  <script>

    $("#prev-demo li.third-item").prev().css("color", "red");

    $("#next-demo li.third-item").next().css("color", "blue");

  </script>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery .prev() vs .next() (Try It)