title: jQuery & drop down menu hiding divs (or textareas)
body: <p>I would like to have a drop down menu with jQuery show and hide the different divs (or textareas) below it. Here's my jQuerycode at the moment:</p>
  
  <pre><code>$(document).ready(function(){
      $('#edit1').hide();
      $('#edit2').hide();
          $("#page_selection").change(function(){
          $("#" + this.value).show().siblings().hide();
          });
      $("#page_selection").change();
      });
  </code></pre>
  
  <p>And html:</p>
  
  <pre><code>&lt;p&gt; 
                  &lt;select id="page_selection"&gt;
                      &lt;option value="edit1"&gt;About All&lt;/option&gt;
                      &lt;option value="edit2"&gt;Home Introduction&lt;/option&gt;
                  &lt;/select&gt;
                  &lt;form method="post" action="page_edit_action.php" /&gt;
                      &lt;div name="about_all" id="edit1"&gt;&lt;?php echo $content['about_all'] ?&gt;&lt;/div&gt;
                      &lt;div name="home_introduction" id="edit2"&gt;&lt;?php echo $content['home_introduction'] ?&gt;&lt;/div&gt;
                  &lt;/form&gt;
                  &lt;/p&gt;
  </code></pre>
  
  <p>This code isn't changing when I choose a different option in the drop down menu.</p>
  
  <p>If possible, I'd like to change the divs to textareas. Thanks :). (BTW, the php arrays have content, feel free to replace with your own placeholder)</p>