the first dropdown is selected it would remove the selected item from the next dropdown
<p>i  have 7 dropdown boxes in html. They will all get populated the same data. What I am trying to do is when the first dropdown is selected it would remove the selected item from the next dropdown. So, if you Have data: A,B,C,D,E,F,G,H,I in one dropdown if I select B in the first drop down then in the next dropdown it should only show A,C,D,E,F,G,H,I and so on up to 7 dropdowns. I dont know what would be the best way to approach this in JavaScript. Thanks for your help in advance
Sample Code:</p>

<pre><code>   &lt;select&gt;
   &lt;option value="1"&gt;1&lt;/option&gt;
   &lt;option value="2"&gt;2&lt;/option&gt;
    &lt;option value="3"&gt;3&lt;/option&gt;
     &lt;/select&gt;

     &lt;select&gt;
     &lt;option value="1"&gt;1&lt;/option&gt;
     &lt;option value="2"&gt;2&lt;/option&gt;
      &lt;option value="3"&gt;3&lt;/option&gt;
      &lt;/select&gt;
    &lt;select&gt;
      &lt;option value="1"&gt;1&lt;/option&gt;
      &lt;option value="2"&gt;2&lt;/option&gt;
      &lt;option value="3"&gt;3&lt;/option&gt;
     &lt;/select&gt;

     &lt;select&gt;
      &lt;option value="1"&gt;1&lt;/option&gt;
       &lt;option value="2"&gt;2&lt;/option&gt;
      &lt;option value="3"&gt;3&lt;/option&gt;
    &lt;/select&gt;
</code></pre>
