remove & add select box option si otra selección cambia

Tengo 3 cuadros de selección y todos tienen el mismo valor (clones) y se crean al cambiar la selección de la tabla de referencia. ahora quiero administrar la selección en el menú desplegable Restricción de tres para que 'No muestre el seleccionado en otros dos' y el usuario no pueda seleccionar el mismo de dos. ¿Cómo hacerlo en jquery?

Code es -

<tr>
<td> Reference Table:</td>
<td>
   <select id="tableCombo" onchange="jQuery.ajax({type:'POST',data:'tableCombo=' +        this.value, url:'/GryphonMonitor   /load/getColumns',success:function(data,textStatus)   {jQuery('#columns').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown)    {},complete:function(XMLHttpRequest,textStatus){LoadSelects();}});" name="tableCombo">
  </td>
  </tr>
  <tr id="cons">
<td nowrap=""> Constraint On: </td>
<td nowrap="">
<select id="columns" onchange="colChange(this);" name="columns">
<option value="CountryCode">CountryCode</option>
<option value="Date">Date</option>
<option value="Number">Number</option>
<option value="Type">Type</option>
</select>
</td>
<td  nowrap=""> Constraint Value: </td>
<td  nowrap="">
 </tr>
<tr id="cons1">
<td> Constraint On: </td>
<td>
<select id="columns2" onchange="colChange(this);" name="columns2">
<option value="CountryCode">CountryCode</option>
<option value="Date">Date</option>
<option value="Number">Number</option>
<option value="Type">Type</option>
 </select>
</td>
<td> Constraint Value: </td>
<td>
 </tr>
 <tr id="cons2">
   <td> Constraint On: </td>
  <td>
  <select id="columns3" onchange="colChange(this);" name="columns3">
<option value="CountryCode">CountryCode</option>
<option value="Date">Date</option>
<option value="Number">Number</option>
<option value="Type">Type</option>
</select>
</td>
<td> Constraint Value: </td>
<td>
  </tr>

as funciones de @JS están aquí-

 function LoadSelects()
{
$("#columns2, #columns3").html( $("#columns").html()).val('') ;
}
  ///I  am trying to do thru this menthod but does not look good. here looking for help.


function getArray()
{
   var selectElement = [];  
  $('#columns option').each(function() {
 selectElement.push($(this).val())
 });
return selectElement;      
}  

 function colChange(col){
selectElements = getArray();
var $this = col;
for (i = 1; i < selectElements.length; i++)
{
     if(col.value == selectElements[i]){
   if(col.name == 'columns'){
  $('#columns2').find('option[value=' + selectElements[i] + ']').remove();
$('#columns3').find('option[value=' + selectElements[i] + ']').remove();
         }
else if(col.name == 'columns2'){
$('#columns').find('option[value=' + selectElements[i] + ']').remove();
$('#columns3').find('option[value=' + selectElements[i] + ']').remove();
             }
else if(col.name == 'columns3'){
$('#columns').find('option[value=' + selectElements[i] + ']').remove();
$('#columns2').find('option[value=' + selectElements[i] + ']').remove();
             }

     }

Estoy seguro de que debería ser algo simple para un desarrollador de jquery experimentado. gracias por adelantado

Respuestas a la pregunta(6)

Su respuesta a la pregunta