Filter() And Find() In jQuery

Both filter() and find() methods are very similar, except the filter is applied to all the elements while finding searches child elements only.

For that, I have used jQuery script file as follows.

<script src="scripts/jquery-1.3.2.min.js"></script>

And also, I have used simple css style shown below.

  1. <style type="text/css">  
  2.     div {  
  3.         padding: 6px;  
  4.         border: 1px solid;  
  5.         width: 40%;  
  6.     }  
  7. </style>  


Some of the jQuery methods I have used are listed below.

  • filter() – search for all the elements.
  • find() – search for all the child elements only.

Here, you can find the source code of what I have developed.


The primary output of my code is as follows:

After a click on the filter hardware then it displays the output shown below.

Then click on find hardware, then display the following output shown below.


Build smarter apps with Machine Learning, Bots, Cognitive Services - Start free.

Start Learning Now