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.