<form method="post" name="ice_cream" id="ice_cream" action="https://cs12.net/form/submit.php">
   <fieldset>
     <legend>Would you like ice cream?     </legend>
     <label>
       <input type="radio" name="want" id="ic_yes" value="yes"/>
Yes     </label>
     <label>
       <input type="radio" name="want" id="ic_no" value="no"/>
No     </label>   </fieldset>
   <fieldset id="icecream_options">
     <legend>Ice Cream Options     </legend>
     <fieldset>
       <legend>Would you like a cup or a cone?       </legend>
       <label>
         <input type="radio" id="container_cup" name="container" value="cup"/>
Cup       </label>
       <label>
         <input type="radio" id="container_cone" name="container" value="cone"/>
Cone       </label>     </fieldset>
     <fieldset>
       <legend>What topping do you want?       </legend>
       <label>
         <input type="checkbox" name="toppings" id="toppings_wc" value="whipcream"/>
Whipped cream       </label>
       <label>
         <input type="checkbox" name="toppings" id="toppings_jimmies" value="jimmies"/>
Jimmies       </label>
       <label>
         <input type="checkbox" name="toppings" id="toppings_sprinkles" value="sprinkles"/>
Sprinkles       </label>
       <label>
         <input type="checkbox" name="toppings" id="toppings_nuts" value="nuts"/>
Nuts       </label>
       <label>
         <input type="checkbox" name="toppings" id="toppings_cherry" value="cherry"/>
Cherry       </label>     </fieldset>   </fieldset>
   <button type="submit">Submit Order   </button>
 </form> 

In style element (<style>) within head element:

body {
  font-family: helvetica, sans-serif;
  margin: 1rem 5%;
  line-height: 1.5;
}

form fieldset {
  margin-bottom: 1rem;
}

label {
  display: block;
}

input[type=submit],
button[type=submit] {
  display: block;
}

#icecream_options {
  border-style: none;
}

.hidden {
  display: none;
}

In script element within head element (<script>):

console.log("hello!");

document.addEventListener("DOMContentLoaded", function(){
    /* do stuff here */
    console.log("dom is loaded!");

    /*

    x hide options when page is loaded
    x click events for to yes and no radio
    x display or hide the options as appropriate
    (hide for 'no', show for 'yes')

    */

    let iceCreamOptions = document.querySelector("#icecream_options");
    console.log(iceCreamOptions);
    iceCreamOptions.classList.add("hidden");

    /* get the "want" input radio */
    let wantRadioInputs = document.querySelectorAll("form input[name=want]");
    console.log(wantRadioInputs);

    wantRadioInputs.forEach(
        function(wantRadio){
            wantRadio.addEventListener("click",function(){
                console.log("want radio is clicked!");
                let yesRadio = document.querySelector("#ic_yes");
                console.log(yesRadio);
                console.log(yesRadio.checked);
                if ( yesRadio.checked == true ) {
                    iceCreamOptions.classList.remove("hidden");
                } else {
                    iceCreamOptions.classList.add("hidden");
                }
            })
        }
    );

})