Knowledge Walls
Ammu
Hyderabad, Andhra Pradesh, India
Passcode:
JQuery Traversing - Filtering in JQuery of JQuery
277 Views

The first(), last(), eq(), filter() and not() Methods

The most basic filtering methods are first(), last() and eq(), which allow you to select a specific element based on its position in a group of elements.

Other filtering methods, like filter() and not() allow you to select elements that match, or do not match, a certain criteria.

example
<!DOCTYPE html>
    <html lang="en-US">
    <head>
        <meta charset="UTF-8">
        <title>internal</title>
        <script   src="https://code.jquery.com/jquery-3.4.1.min.js"   integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="   crossorigin="anonymous"></script>
    </head>
    <body>
        <script>
            $(document).ready(function(){
                $("#btn").click(function(){
                 
                    $(".class1").find(".teachers").children().first().css("background-color","red");
                    $(".class1").find(".teachers").children().last().css("background-color","yellow");
                    $(".class1").find(".office").children().eq(1).css("background-color","blue");
                    $(".class1").find(".office").children().filter(".staff").css("background-color","orange");
                    $(".class1").find(".office").children().not(".staff").css("background-color","grey");
                });
            });    
                
        </script>
        <div class="class1">
        <div>
            <ul class="teachers">
                <li>Sarathy</li>
                <li>Partha</li>
            </ul>
            <ul class="students">
                <li>Siva</li>
                <li>Ram</li>
            </ul>
            <ul class="office">
                <li>Kala</li>
                <li class="staff">JOhn</li>
                <li class="staff">Gopal</li>
            </ul>
            <button id="btn">click here</button>
        </div>
    </body>
</html>
Next Topics
Next lessons of current book.
Previous Topics
Previous lessons of current book.
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
Best Lessons of "JQuery"
Top lessons which are viewed more times.
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
JQuery of JQuery
  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