title: How can I have one dropdown hide/show depending on the selection of another dropdown?
body: <p>I have a contact form that has a drop-down for referral source. If <code>Magazine</code> is selected from referral source, I want to show another, hidden drop-down menu for which magazine, If another option is then selected for referral source, I want the magazine list to disappear. So far I have the following (weak sauce) JavaScript:</p>
  
  <pre><code>function showObject(id) {
      document.getElementById(id).style.display = 'block';
  }
  function hideObject(id) {
      document.getElementById(id).style.display = 'none';
  }
  </code></pre>
  
  <p>And the following HTML (part of a form):</p>
  
  <pre><code>&lt;label&gt;Referral Source &lt;/label&gt;
  &lt;select class="contact-input-dropdown"&gt;
      &lt;option value=""&gt;Select One (Required)&lt;/option&gt;
      &lt;option value="Email from Us"&gt;Email from Us&lt;/option&gt;
      &lt;option value="Friend or Associate"&gt;Friend or Associate&lt;/option&gt;
      &lt;option value="Flyer/Mailing"&gt;Flyer/Mailing&lt;/option&gt;
      &lt;option value="Magazine"&gt;Magazine&lt;/option&gt;
      &lt;option value="Online Search Engine"&gt;Online Search Engine&lt;/option&gt;
      &lt;option value="Tradeshow"&gt;Tradeshow&lt;/option&gt;
      &lt;option value="Social Media"&gt;Social Media&lt;/option&gt;
  &lt;/select&gt;
  &lt;br&gt;
  &lt;label id="magazine-label" style="display:none"&gt;Magazine&lt;/label&gt;
  &lt;select id="magazine" class="contact-input-dropdown" style="display:none;" name="magazine"&gt;
      &lt;option value="Not Specified"&gt;Select One&lt;/option&gt;
      &lt;option value="X Management"&gt;X Management&lt;/option&gt;
      &lt;option value="Test Mag 1"&gt;Test Mag 1&lt;/option&gt;
      &lt;option value="Test Mag 2"&gt;Test Mag 2&lt;/option&gt;
      &lt;option value="Test Mag 3"&gt;Test Mag 3&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I want to check the Referral Source whenever it's changed, show the Magazine input if <code>Magazine</code> was chosen, or hide it if <code>Magazine</code> was not chosen.</p>