Edit

jQuery Filters

Example of Code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
    .example-jquery-filter{
        margin: 20px;
    }
</style>
<script>
$(document).ready(function(){
  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#myTable tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });
});
</script>
<div class="example-jquery-filter">
<h2>jquery Filtering</h2>
<p>Type User Name or Email ID in search field</p>  
<input id="myInput" type="text" placeholder="Search Here..">
<br><br>
  <table class="table">
    <thead>
      <tr>
        <th>Row</th>
        <th>User Name</th>
        <th>Email ID</th>
      </tr>
    </thead>
    <tbody id="myTable">
      <tr>
        <td>1</td>
        <td>Michel Clark</td>
        <td>clark@gmail.com</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Shane warne</td>
        <td>warne@gmail.com</td>
      </tr>
      <tr>
        <td>3</td>
        <td>Ryan Haris</td>
        <td>haris@gmail.com</td>
      </tr>
    </tbody>
  </table>
</div>

Output

jquery Filtering

Type User Name or Email ID in search field



RowUser NameEmail ID
1Michel Clarkclark@gmail.com
2Shane warnewarne@gmail.com
3Ryan Harisharis@gmail.com