title: how make a filter for each table column?
body: <p>Currently I have to filter on all the content of the table, since the filter is done for each row, what I am looking for is to be able to have an input on each column and search in that particular column. I attach the code on how I currently have it. I hope you can help me. Thanks a lot</p>
  <p>TABLE</p>
  <pre><code>&lt;div class=&quot;input-group mb-3&quot;&gt;
                  &lt;div class=&quot;input-group-prepend&quot;&gt;
                      &lt;span class=&quot;input-group-text&quot; id=&quot;basic-addon1&quot;&gt;Quick Search&lt;/span&gt;
                  &lt;/div&gt;
                      &lt;input id=&quot;filterContent&quot; class=&quot;form-control mr-sm-2&quot; type=&quot;text&quot; placeholder=&quot;Search&quot; aria-label=&quot;Search&quot;&gt;
                  &lt;/div&gt;
  &lt;table class=&quot;table table-striped table-bordered table-sm text-center&quot; style=&quot;width:100%; margin:auto;&quot;&gt;
              &lt;thead class= &quot;text-center table-info&quot;&gt;
                  &lt;tr&gt;
                      &lt;th&gt;#&lt;/th&gt;
                      &lt;th&gt;Customer&lt;/th&gt;
                      &lt;th&gt;Phone 1&lt;/th&gt;
                      &lt;th&gt;Phone 2&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody class=&quot;quickSearch&quot;&gt;
              &lt;?php foreach($users as $user):
                  $counter++ ?&gt;
                      &lt;tr class=&quot;text-center&quot;&gt;
                          &lt;td&gt;&lt;?= $counter; ?&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;?= $user['CUSTOMER'] ;?&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;?= $user['PHONE_1'] ;?&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;?= $user['PHONE_2'] ;?&gt;&lt;/td&gt;
                      &lt;/tr&gt;
              &lt;?php endforeach; ?&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
  
  
  </code></pre>
  <p>SCRIPT</p>
  <pre><code>&lt;script type=&quot;text/javascript&quot;&gt;
          $(document).ready(function () {
          (function($) {
              $('#filterContent').keyup(function () {
                      var searchValue = new RegExp($(this).val(), 'i');
                      $('.quickSearch tr').hide();
                      $('.quickSearch tr').filter(function () {
                          return searchValue.test($(this).text());
                      }).show();
                          })
              }(jQuery));
          });
      &lt;/script&gt; 
  
  </code></pre>
  <p><a href="https://i.stack.imgur.com/KE1oc.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KE1oc.jpg" alt="description" /></a></p>