JSFiddle - React, Tailwind, and code Playground

HTML

<table border="1">
    <tr>
        <td class="noBG" colspan="3">
            <select id="displayText" onchange="toggle();">
                <option>2</option>
                <option>4</option>
            </select>Items
        </td>
    </tr>
    <tr>
        <td>Dates</td>
        <td>Time</td>
        <td>Person</td>
    </tr>
    <tr>
        <td>12/3</td>
        <td>12:45</td>
        <td>John Doe</td>
    </tr>
    <tr>
        <td>12/4</td>
        <td>12:45</td>
        <td>James Doe</td>
    </tr>
    <tr name="toggleText" class="hiddenRow">
        <td>12/4</td>
        <td>12:45</td>
        <td>Janey Doe</td>
    </tr>
    <tr name="toggleText" class="hiddenRow">
        <td>12/4</td>
        <td>12:45</td>
        <td>Janey Doe</td>
    </tr>
</table>

<script language="javascript">
function toggle() {
    $.each($('tr[name=toggleText]'), function() {
        $(this).toggleClass("hiddenRow", $(this).attr('class') != "hiddenRow");
    });
}
</script>

CSS

.hiddenRow {
    display: none;
}