JSFiddle - React, Tailwind, and code Playground

HTML

<table id="myTable">
    <tbody>
        <tr>
            <td>1</td>
            <td>Bulldog</td>
            <td>7/26/2013 12:00:00 AM</td>
            <td>100.00</td>
            <td>5000.00</td>
            <td>Hydrated Lime Powder</td>
            <td>Boxer</td>
            <td>Bulldog</td>
        </tr>
        <tr>
            <td>1</td>
            <td>Bulldog</td>
            <td>7/26/2013 12:00:00 AM</td>
            <td>100.00</td>
            <td>5000.00</td>
            <td>Hydrated Lime Powder</td>
            <td>Boxer</td>
            <td>hotdog</td>
        </tr>
    </tbody>
</table>
<br/>
<select id="selCol">
    <option selected disabled>Select a column...</option>
    <option>0</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
</select>
<input type="text" id="searchText" />
<input type="button" id="search" value="Search" />

CSS

.result{background-color:yellow;}

JavaScript

$(document).ready(function () {
     $("#search").click(function () {
         var searchText;
         var col = $('#selCol option:selected').val();
         $("tr").removeClass("result");
         if (col == 0 || col == 1 || col == 3) {
             searchText = $("#searchText").val();
         } else if (col == 6) {
             searchText = $("#maxPets option:selected").text();
         } else if (col == 7) {
             searchText = $("#maxWeight option:selected").text();
         }
         $("#myTable tr").filter(function () {
             return $("td:eq(" + col + ")", this).text().indexOf(searchText) !== -1;
         }).closest("tr").addClass("result");
     });
 });