JSFiddle - React, Tailwind, and code Playground

by secretgspot

HTML

<select id="filter">
  <option value="dogs">dogs</option>
  <option value="cats">cats</option>
</select>

<table id="boing" border="1">
<tr>
<th>header</th>
</tr>
<tr>
<td class="dogs">dogs</td>
</tr>
<tr>
<td>dogs</td>
</tr>
    <tr>
<td class="cats">cats</td>
</tr>
    <tr>
<td class="cats">cats</td>
</tr>
    <tr>
<td class="dogs">dogs</td>
</tr>
            <tr>
<td class="fish">fish</td>
</tr>
</table>
<span id="blah"></span>

JavaScript

$("#filter").change(function(){
    $("#matrix tbody").find("td").each(function(){
        if($(this).attr("class") != $("#filter").val())
            $(this).addClass("hide");
        else 
            $(this).addClass("show");
    });
});