jQuery ist ein sehr leistungsfähiges Tool, das uns hilft, eine Vielzahl von DOM-Traversal-Methoden zu integrieren, um Elemente in einem Dokument zufällig oder in sequentieller Reihenfolge auszuwählen. Die meisten der DOM-Traversal-Methoden ändern die Elemente nicht, während sie sie unter den gegebenen Bedingungen herausfiltern.
Die Methode filter() wird verwendet, um alle Elemente herauszufiltern, die den ausgewählten Kriterien nicht entsprechen, und diese Übereinstimmungen werden zurückgegeben.
Syntax:

$(selector).filter(criteria, function(index))

Parameter:
Kriterien: Gibt einen Auswahlausdruck, ein jQuery-Objekt oder ein oder mehrere Elemente an, die aus einer Gruppe ausgewählter Elemente zurückgegeben werden sollen.
function(index) : Gibt eine Funktion an, die für jedes Element in der Menge ausgeführt werden soll. Wenn die Funktion wahr zurückgibt, wird das Element beibehalten. Andernfalls wird es entfernt.
index : Die Indexposition des Elements in der Menge.
HINWEIS: Um mehr als ein Kriterium anzugeben, verwenden Sie ein Komma.

jQuery-Code, um die Funktionsweise der filter()-Methode zu zeigen
Code Nr. 1: Dieser Code gibt alle Elemente zurück, die mit ausgewählten Kriterien übereinstimmen. 
<html>
  
<head>
    <title>GEEKS FOR GEEKS ARTICLE</title>
    <script src="https://ajax.googleapis.com/ajax/libs/
                 jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("li").filter(".first, .last").css("color", "red")
                .css("backgroundColor", "yellow");
        });
    </script>
</head>
  
<body>
    <ul>
        <li class="first">GeeksForGeeks</li>
        <li class="first">GeeksForGeeks</li>
        <li class="middle">GeeksForGeeks</li>
        <li class="last">GeeksForGeeks</li>
        <li class="last">GeeksForGeeks</li>
    </ul>
</body>
  
</html>

Ausgabe:

Code Nr. 2:
Dieser Code wählt die Elemente aus, die mit den von der Funktion geprüften Kriterien übereinstimmen. Hier prüft die Funktion auf zwei Elemente in einer Liste und gibt wahr oder falsch zurück.

<html>
  
<head>
    <title>GEEKS FOR GEEKS ARTICLE</title>
    <script src="https://ajax.googleapis.com/ajax/libs/
                 jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("ul").filter(function() {
                return $("li", this).length == 2;
            }).css("color", "red").css("fontSize", "20");
        });
    </script>
</head>
  
<body>
    A list with two elements:
    <ul>
        <li>option1</li>
        <li>option2</li>
    </ul>
    A list with one element:
    <ul>
        <li>option1</li>
    </ul>
    A list with two elements:
    <ul>
        <li>option1</li>
        <li>option2</li>
    </ul>
    A list with three elements:
    <ul>
        <li>option1</li>
    </ul>
    <ul>
        <li>option2</li>
    </ul>
    <ul>
        <li>option3</li>
    </ul>
</body>
  
</html>

Ausgabe: