title: Hide a div based on a select input box
body: <p>I was helped with some code <a href="http://jsfiddle.net/K9zGP/13/" rel="nofollow">here</a>. I tweaked it to try and hide a whole div instead of an element. It was only a small tweak but I seem to have done something to stop it working.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;input type="text" name="text-708" value="" class="wpcf7-validates-as-required" size="40"&gt;
  &lt;div id="added_fields"&gt;
      &lt;select name="menu-168" class="wpcf7-validates-as-required"&gt;
          &lt;option value="Residential"&gt;Residential&lt;/option&gt;
          &lt;option value="Commercial"&gt;Commercial&lt;/option&gt;
      &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>if ($("select[name='menu-168']").val() == "Commercial") {
      $("#added_fields").addClass("hidden");
  }​
  </code></pre>
  
  <p>Would someone be kind enough to tell me where I have gone wrong?</p>