JSFiddle - React, Tailwind, and code Playground
HTML
<table border="1">
<tr>
<td>
<b>Score:</b>
<select id="scoreA">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
<td><b>Score:</b>
<select id="scoreB">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
<td><b>Score:</b>
<select id="scoreC">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
<td><b>Score:</b>
<select id="scoreD">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</td>
</tr>
<tr>
<td>
<select id="t10">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
</td>
<td>
<select id="t20">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
</td>
</tr>
JavaScript
$("select").change(function()
{
var tr = $(this).closest("tr");
tr.find("select option").attr("disabled",""); //enable everything
//collect the values from selected;
var arr = $.map
(
tr.find("select option:selected"), function(n)
{
return n.value;
}
);
//disable elements
tr.find("select option").filter(function()
{
return $.inArray($(this).val(),arr)>-1; //if value is in the array of selected values
}).attr("disabled","disabled");
});