dynamic drop-down with jquery
<p>I have a page that shows 3 drop-down selectors on the page. I also have a jQuery code that checks to make sure that if one option is selected the same one is not allowed to be selected in the other 2 drop-downs.</p>

<p>I need to change the code not to only stop from allowing selecting a duplicate but to completely remove selected option from the other drop-downs below this one. I assume I would have to put all options into an array and somehow remove from the list when generating next drop-down.</p>

<p>Alternatively I need to mark already selected ones with a different color, with a class, perhaps.</p>

<p>Here's my current code:</p>

<pre><code>$('.mySelect').change(function(index, elem){
    var myFilter = $(this).val();
    if(myFilter !="selectOne"){
        var size = $('.qSelect').not(this).not(function(index){
        return $(this).val() != myFilter;
    }).size();
        if(size &gt; 0){
            alert("already selected.");
        } else {
            // do something
        }   
    }   
});

&lt;select name="select1" class="mySelect"&gt;
    &lt;option value="selectOne"&gt;Select one&lt;/option&gt;
    &lt;option value="1"&gt;Option 1&lt;/option&gt;
    &lt;option value="2"&gt;Option 2&lt;/option&gt;
    &lt;option value="3"&gt;Option 3&lt;/option&gt;
&lt;/select&gt;

&lt;select name="select2" class="mySelect"&gt;
    &lt;option value="selectOne"&gt;Select one&lt;/option&gt;
    &lt;option value="1"&gt;Option 1&lt;/option&gt;
    &lt;option value="2"&gt;Option 2&lt;/option&gt;
    &lt;option value="3"&gt;Option 3&lt;/option&gt;
&lt;/select&gt;   

&lt;select name="select3" class="mySelect"&gt;
    &lt;option value="selectOne"&gt;Select one&lt;/option&gt;
    &lt;option value="1"&gt;Option 1&lt;/option&gt;
    &lt;option value="2"&gt;Option 2&lt;/option&gt;
    &lt;option value="3"&gt;Option 3&lt;/option&gt;
&lt;/select&gt;
</code></pre>
