В раскрывающемся меню jQuery не отображаются скрытые элементы

Question

Есть кое-что очевидное, что я упускаю из-за этого ... просто пытаюсь отобразить скрытые дивы в зависимости от значения выпадающего меню ... вот jsfiddle:

jsFiddle пример

и код ..

<p id="data"></p>  

<select id="dropdown">

      <option label="US CERT1">"#divone"</option>
      <option label="US CERT2">"#divtwo"</option>
      <option label="NIST">"#divfour"</option>
      <option label="DHS NY">"#divfive"</option>      
      <option label="DHS News">"#divsix"</option>   

  </select>

  <div id="divone" class="section" >  

     Contents of divone

  </div>


<script>
$(document).ready(function () {

   function displayVals() {
      var targetdiv = $("#dropdown").val();
      $("#data").html("<b>Var data:</b> " +  targetdiv  );
      $('.section').css('display','none');
      $(targetdiv).css('display','block');
   }

   $("select").change(displayVals);
   displayVals();

});
</script>

Answer 1

Удалить предложения из значений option:

  <option label="US CERT1">#divone</option>
  <option label="US CERT2">#divtwo</option>
  <option label="NIST">#divfour</option>
  <option label="DHS NY">#divfive</option>      
  <option label="DHS News">#divsix</option>   

Обновленный пример: http://jsfiddle.net/andrewwhitaker/nKL5v/

Причина в том, что эта строка:

$(targetdiv)

эквивалентна чему-то вроде $("\"#divone\""), который содержит недопустимый селектор.