Question

I am trying to duplicate a drop down list with jquery. Basically I want when the user clicks a button it will run this and it will remove the value they have selected in the previous drop down box. I am getting my values originally from mySQL.Which then outputs them to a drop down list. When I run this though, the only thing I am getting is the first option I have which is “Select an Interest” in my second drop down list. Can Anyone see why this isn’t working?

Also these are submitted to a form as Arrays hence the square brackets on the name. I am not sure if this is what is causing this but anyones feedback on that is welcome.

Interests<br />
<select name="selectedint[]" id="selectint">
<option selected value="">Select an Interest</option>
<?
for ($i=0; $i<$setintcount; $i++)
{
      if($setinterests[$i] == $interests[$i])
      {
          echo "<option selected value='$setinterests[$i]'>$setinterests[$i]</option>";
      }
      else
      {
          echo "<option value='$setinterests[$i]'>$setinterests[$i]</option>";
      }
}
?>
</select>

<select name="selectedint2[]" id="select">
<option selected value="">Select an Interest</option>
<script>
$('#selectint option').each(function()
{

    $(document).ready(function () {
        if("#selectedint".val() != this)
        {
        document.write(this);
        }
    }
});
</script>
</select>

Answer 1

To copy a dropdownlist and clear the selection you can use the clone method, with removeAttr.

var newDD = $("#yourDD").clone();
$("option", newDD).removeAttr("selected");

Check out this fiddle