JSFiddle - React, Tailwind, and code Playground
HTML
<h3> Table 1</h3>
<table id="table1" border="1">
<tr>
<td>select any option</td>
<td>
<select>
<option value="--select--">--select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi">Audi</option>
</select>
</td>
</tr>
<tr>
<td>select any option</td>
<td>
<select>
<option value="--select--">--select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi">Audi</option>
</select>
</td>
</tr>
<tr>
<td>select any option</td>
<td>
<select>
<option value="--select--">--select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi">Audi</option>
</select>
</td>
</tr>
</table>
<br>
<h3> Table 2</h3>
<table id="table2" border="1">
<tr>
<td>select any option</td>
<td>
<select>
<option value="--select--">--select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi">Audi</option>
</select>
</td>
</tr>
<tr>
<td>select any option</td>
<td>
<select>
<option value="--select--">--select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option...
JavaScript
$('select').change(function () {
if ($(this).closest('table').find('option[value=' + $(this).val() + ']:selected').length > 1)
{
alert('option is already selected');
$(this).val($(this).find("option:first").val());
}
});