javascript - Using onchange to delete other occurrences of the value in the select element -

so have made couple of attempts of , feel close couldn't find correct ajax. select elements made dynamically on click of button, , have same options, want happen once choose option, other occurrences of option removed select elements leaving 1 chose alone.

this 1 removes every select element has class 'theclass' including 1 changed.

function removeoptions(optionvalue) {     $('.theclass option[value='+optionvalue+']').remove(); } 

i tried .each() function couldn't call 'this' correct.

function removeoptions(optionvalue) {     $( ".theclass").each( function () {         $(this + 'option[value='+optionvalue+']').remove();     } } 

any appreciated

you can use .not() filter ones want keep, below.

$(document).on("change", "select", function() {        var val = $(this).val();      $(this).find("option[value='" + val + "']:not(:selected)").remove();      });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <select>      <option value="1">1</option>      <option value="2">2</option>      <option value="3">3</option>      <option value="3">3</option>      <option value="2">2</option>      <option value="1">1</option>      <option value="2">2</option>      <option value="3">3</option>  </select>

edit: per comment, following work.

$(document).on("change", "select", removeoptions);  function removeoptions() {     var val = $(this).val();     $("select").not(this).find("option[value='" + val + "']").remove(); } 

take look @ demo working example.