JSFiddle - React, Tailwind, and code Playground

by f0t0n

HTML

<table id="cities" border="1">
    <tr>
        <td>
            Miami, FL
            <input type="checkbox" value="Miami" class="FL" />
        </td>
        <td>
            New York City, NY
            <input type="checkbox" value="New York City" class="NY" />
        </td>
    </tr>
    <tr>
        <td>
            Tampa, FL
            <input type="checkbox" value="Tampa" class="FL" />
        </td>
        <td>
            Buffalo, NY
            <input type="checkbox" value="Buffalo" class="NY" />
        </td>
    </tr>
</table>

<select id="states">
     <option value="FL">FL</option>
    <option value="NY">NY</option>
</select>

<script type="text/javascript">
    var cities = document.getElementById('cities'),
    states = document.getElementById('states');

    function checkCitiesOf(state) {
        inputs = cities.getElementsByTagName('input');
        for(var i = 0, l = inputs.length; i < l; i++) {
            inputs[i].checked = inputs[i].className == state;       
        }
    }
    
    states.onchange = function() {
        checkCitiesOf(this.value);
    };
</script>