JSFiddle - React, Tailwind, and code Playground

by Patti

HTML

<script type='text/javascript'>
    function showHall() {
    var x = document.getElementById("schoolName");
    var val = x.options[x.selectedIndex].value;
    

    switch (val) {
        case "williams_college":
            document.getElementById("williamsHall").style.display = "inline";
            document.getElementById("albanyHall").style.display = "none";
            break;
        case "suny_albany":
            document.getElementById("albanyHall").style.display = "inline";
            document.getElementById("williamsHall").style.display = "none";
            break;

        default:
            document.getElementById("albanyHall").style.display = "none";
            document.getElementById("williamsHall").style.display = "none";
            break;
    }
}
</script>
<tr>
    <th>Select School:</th>
    <td>
        <select id="schoolName" colspan="2" onchange="showHall()">
            <option value="select_school" selected="selected">Select Your School</option>
            <option value="suny_albany">SUNY ALBANY</option>
            <option value="williams_college">WILLIAMS COLLEGE</option>
        </select>
    </td>
</tr>
<tr>
    <th>Hall:</th>
    <td>
        <select id="williamsHall" colspan="2">
            <option selected value="select_school">Select Your Hall</option>
            <option value="AGARD">AGARD</option>
            <option value="ARMSTRONG">ARMSTRONG</option>
            <option class="optionHall" value="OTHER">OTHER</option>
            <option class="optionHall" value="HALL NOT ASSIGNED">HALL NOT ASSIGNED</option>
        </select>
          <select id="albanyHall" colspan="2">
                <option selected value="select_school">Select Your Hall</option>
                <option value="HALL1">ALBANY HALL1</option>
                <option value="HALL2">ALBANY HALL2</option>
                <option value="HALL3">ALBANY HALL3</option>
                <option value="OTHER">OTHER</option>
                <option value="HALL NOT...