title: jQuery Dropdown Show/Hide div
body: <p>I really don't know much about javascript, but I am trying to use the following code which works well. The problem I am having is if I add a "..." or ":" at the end of the "Choose" option, the code no longer works.</p>
  
  <p><a href="http://jsfiddle.net/fj63g/58/" rel="nofollow">http://jsfiddle.net/fj63g/58/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;select id="dropDown"&gt;
      &lt;option&gt;Choose&lt;/option&gt;
      &lt;option value="div1"&gt;Show Div 1&lt;/option&gt;
      &lt;option value="div2"&gt;Show Div 2&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;div id="div1" class="drop-down-show-hide"&gt;div 1&lt;/div&gt;
  &lt;div id="div2" class="drop-down-show-hide"&gt;div 2&lt;/div&gt;
  </code></pre>
  
  <p>Script:</p>
  
  <pre><code>$('.drop-down-show-hide').hide();
  
  $('#dropDown').change(function(){
  $(this).find("option").each(function()
  {
  $('#' + this.value).hide();
  });
      $('#' + this.value).show();
  
  });
  </code></pre>
  
  <p>Any help is much appreciated! Thanks!</p>