JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Example 1 - Prompts</h1>
<input type="checkbox" name="chkVitalSigns" id="chkVitalSigns" onclick="toggleVisible('spanVitalSignsPrompts',this);" />
Vital Signs
<span id="spanVitalSignsPrompts" style="display:none">
    Frequency:
    <select name="cboVitalSignsFreq" id="cboVitalSignsFreq">
        <option>Q15 MIN</option>
        <option>Q30 MIN</option>
        <option>Q1 HR</option>
        <option>Q4 HR</option>
    </select>
</span>
<hr />
<h1>Example 2 - Sub orders</h1>
<table>
    <tr><td>
        <input type="checkbox" name="chkMainOrder" id="chkMainOrder" onclick="toggleVisible('rowSubOrders',this);" />
        Main Order
    </td></tr>
    <tr id="rowSubOrders" style="display:none"><td><table>
        <tr><td>
            <input type="checkbox" name="chkSubOrder1" id="chkSubOrder1" />
            Sub Order 1
        </td></tr>
        <tr><td>
            <input type="checkbox" name="chkSubOrder2" id="chkSubOrder2" />
            Sub Order 2
        </td></tr>
    </table></td></tr>
</table>

CSS

h1 {
    font-size: 14pt;
    font-family: verdana,tahoma
}

table table { padding-left: 25px; }

JavaScript

function toggleVisible(objName, chkBox) {
    document.getElementById(objName).style.display = (chkBox.checked) ? "" : "none";
}