title: Create a conditional statement for <select> HTML markup in JQuery
body: <p>how do i choose a value in a <code>&lt;select&gt;</code> HTML markup to be processed by a JQUERY, when <code>clicked</code> or <code>chosen</code> the specified div will show, the rest of the divs will be hidden.</p>
  
  <p>I've shown only 3, but there are 10 more choices.</p>
  
  <pre><code>&lt;select id="category"&gt;
  &lt;option value="" disabled="disabled" selected="selected"&gt;Please select a category&lt;/option&gt;
  &lt;option name="choice1" value="pie"&gt;   Pie  &lt;/option&gt;
  &lt;option name="choice2" value="cake"&gt;  Cake &lt;/option&gt;
  &lt;option name="choice2" value="candy"&gt; Candy &lt;/option&gt;
  
  &lt;/select&gt;
  </code></pre>
  
  <p>Hidden Divs</p>
  
  <pre><code>&lt;div id="divPie" class="food"&gt;
  &lt;p&gt; this is pie &lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div id="divCake" class="food"&gt;
  &lt;p&gt; this is pie &lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div id="divCandy" class="food"&gt;
  &lt;p&gt; this is pie &lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>goes something like this..</p>
  
  <pre><code>if $('#category').val("pie"); {
      //then show divpie
  }
  else {
       //hide the other divs
   }
  </code></pre>