How to remove parameters from select element using jquery?

Question

I have n dropdowns:

<select id="select1">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

<select id="select2">
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>

with the same parameters. All options must be unique, therefore, when an option is selected in one list box, it must be removed from others. So, if the user selects "1" in select1, in select2 there will only be options "2" and "3".

Now jQuery disabling SELECT options based on the selected radio (requires support for all browsers) offers a good solution, but how can I change this to work with selects instead of radio buttons?

Answer 1

Is that what you mean?

#select2, #select1:

$("#select2 option").each(function() {
    if($("#select1 option[value=" + this.value + "]").length)
        $(this).remove();
});

, :

$("select").each(function() {
  var select = $(this);  
  select.children("option").each(function() {
    $('select').not(select).children("option[value=" + this.value + "]").remove();
  });
});

, <select>, .

:

$("#select1").change(function() {
 $("#select2 option[value=" + $(this).val()+ "]").remove();
});

Answer 2

, .

$('select').change(function() {
    var selectedIndex = $(this).find(':selected').index();    
    $('select').not(this).find('option:nth-child(' + selectedIndex + ')').remove();
)};

, ( ).