a/20210345/1636522

by wind_chime18

HTML

<input id="emp_search" />
    <input id="search" type="button" value="search" />
    <table>
       <tr>
           <th>First Name</th>
           <th>Last Name</th>
           <th>number</th>
           <th>letters</th>
       </tr>
       <tr>
           <td>John</td>
           <td>Lennon</td>
           <td>151</td>
           <td>Male</td>
       </tr>
       <tr>
           <td>Paul</td>
           <td>McCartney</td>
           <td>753</td>
           <td>Female</td>
       </tr>
       <tr>
           <td>George</td>
           <td>Harrison</td>
           <td>24</td>
           <td>Beatles</td>
       </tr>
       <tr>
           <td>Ringo</td>
           <td>Starr</td>
           <td>26</td>
           <td>Beatles</td>
       </tr>
    </table>

JavaScript

if (!RegExp.escape) {
    RegExp.escape = function (s) {
        return s.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&")
    };
}

// AND

jQuery(function ($) {
    $('#search').click(function () {
        var searchthis = $('#emp_search').val().match(/[^\s]+/g) || [];
        $('table').find('tr').slice(1).each(function (index) {
            var text = $(this).text(), 
                toggle = true;
            $.each(searchthis, function () {
                toggle = new RegExp(RegExp.escape(this), 'i').test(text);
                if (!toggle) return false;
            });
            $(this).toggle(toggle);
        });
    });
});

// OR

/*jQuery(function ($) {
    $('#search').click(function () {
        var searchthis = new RegExp(
            $.trim($('#emp_search').val()).replace(/\s+/g, '|'), 'i'
        );
        $('table').find('tr').slice(1).each(function (index) {
            var text = $.trim($(this).text());
            $(this).toggle(searchthis.test(text));
        });
    });
});*/