JSFiddle - React, Tailwind, and code Playground

HTML

<table border width="100%">
    <tr>
        <td>test11</td>
        <td>test12</td>
        <td>3</td>
        <td>test14</td>
    </tr>
    <tr>
        <td>test11</td>
        <td>test12</td>
        <td>3</td>
        <td>test14</td>
    </tr>
    <tr>
        <td>test11</td>
        <td>test12</td>
        <td>2</td>
        <td>test14</td>
    </tr>
</table>
<hr />
<form id="live-search" action="" class="styled" method="post">
    <fieldset>
        <input type="text" class="text-input" id="filter" value="" /> <span id="filter-count"></span>

    </fieldset>
</form>

JavaScript

$(document).ready(function () {
    $("#filter").keyup(function () {

        // Retrieve the input field text and reset the count to zero
        var filter = 2;
        count = 0;

        // Loop through the comment list
        $("table td").each(function () {

            // If the list item does not contain the text phrase fade it out
            if ($(2).text().search(new RegExp(filter, "i")) < 0) {
                $(2).fadeOut();

                // Show the list item if the phrase matches and increase the count by 1
            } else {
                $(2).show();
                count++;
            }
        });

        // Update the count
        var numberItems = count;
        $("2").text("Number of Comments = " + count);
    });
});