Knowledge Walls
Gopal Rao
Mumbai, Maharashtra, India
Passcode:
How to select next element in jquery in Jquery functions of JQuery Examples
2508 Views
Note 
next() method is used to select next of the current element.
Example: 1 How to select only next element of the current element.

Related Topic:

prev() method is used to select previous of the current element.
Example: 2 How to select only previous element of the current element.
Example.1 How to select only next element of the current element?
<html>

<head>
    <title>HTML-JQuery</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

    <script type="text/javascript">
        $(function () {
            $(".element").click(function () {
                $(this).next().css("color", "red");
            });
        });
    </script>
</head>

<body>
    <div class="element">click here to apply red color on next element</div>
    <div class="element">click here to apply red color on next element</div>
    <div class="element">click here to apply red color on next element</div>
    <div class="element">click here to apply red color on next element</div>
    <div class="element">click here to apply red color on next element</div>
</body>

</html>
Example.2 How to select only previous element of the current element
<html>
  <head>
    <title>HTML-JQuery</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $(".element").click(function () {
                $(this).prev().css("color", "red");
            });
        });
    </script>
  </head>
  <body>
    <div class="element">click here to apply red color on previous element</div >
    <div class="element" > click here to apply red color on previous element </div>
    <div class="element">click here to apply red color on previous element</div>
    <div class ="element"> click here to apply red color on previous element < /div>
    <div class="element">click here to apply red color on previous element</div >
  </body>
</html >
Example: 1 Demo 
Example: 2 Demo 
Next Topics
Next lessons of current book.
Previous Topics
Previous lessons of current book.
Best Lessons of "JQuery Examples"
Top lessons which are viewed more times.
  Copyright © 2014 Knowledge walls, All rights reserved
KnowledgeWalls
keep your tutorials and learnings with KnowledgeWalls. Don't lose your learnings hereafter. Save and revise it whenever required.
Click here for more details