Using jQuery replaceWith() with HTML Select

I am attempting to replace a div class with a different one based on the content of an HTML select. Unfortunately, the following code doesn't seem to be working.

  <script type="text/javascript">
  $(document).ready(function() {
      $("answerDropdown").change(function() {
          var val = $(this).selectedValues();
          if (val != '') {
            $("filler").replaceWith('<div id="replaced"> Replaced. </div>');
          }
      });
  });
  </script>

 <select id="answerDropdown">
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</开发者_如何转开发option>
 </select>

 <div id="filler">Replace Me!</div>

Any suggestions?

#id selectors need a # prefix and use .val() to get a <select> element's value, it should be:

$(document).ready(function() {
  $("#answerDropdown").change(function() {
      var val = $(this).val();
      if (val != '') {
        $("#filler").replaceWith('<div id="replaced"> Replaced. </div>');
      }
  });
});

You can test it out here.

Id selectors should be used with #. You have to use #filler for wrapping the div.