## jQuery and Ice Cream

### JavaScript

Ice Cream and JavaScript

    document.addEventListener("DOMContentLoaded", function(){
    /* js to be executed when dom is loaded goes here */

      let iceCreamOptions = document.getElementById("icecream_options_v2");
      let wantRadioButtons = document.querySelectorAll("form input[name=want]");

      let icoClasses = iceCreamOptions.classList;
      icoClasses.add("collapsed");

      for (let radio of wantRadioButtons) {
        radio.addEventListener("click",function(){
          let yesRadio = document.getElementById("ic_yes");
          if (yesRadio.checked == true) {
            icoClasses.remove("collapsed");
          } else {
            icoClasses.add("collapsed");
          }
        })
      }

    });

### jQuery

Ice Cream and jQuery

- jQuery automatically sets up loops if there are multiple items
  e.g. `$("form input[name=want]")`

    $(document).ready(function(){
      console.log("jQuery ready!");
      let iceCreamOptions = $("#icecream_options_v2");
      let wantRadioButtons = $("#form input[name=want]");

      iceCreamOptions.addClass("collapsed");
      yesRadio = $('#ic_yes');
      $("form input[name=want]").click( function(){
        if (yesRadio.is(':checked') == true) {
          iceCreamOptions.removeClass("collapsed");
        } else {
          iceCreamOptions.addClass("collapsed");
        }
      })
    });