JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<select name="select-1" id="select-1" class="connSelect">
<option value="">-- pick one --</option>
<option value="1">-- 1 --</option>
<option value="2">-- 2 --</option>
<option value="3">-- 3 --</option>
<option value="4">-- 4 --</option>
<option value="5">-- 5 --</option>
</select>
<select name="select-2" id="select-2" class="connSelect">
<option value="">-- pick one --</option>
<option value="1">-- 1 --</option>
<option value="2">-- 2 --</option>
<option value="3">-- 3 --</option>
<option value="4">-- 4 --</option>
<option value="5">-- 5 --</option>
</select>
<select name="select-3" id="select-3" class="connSelect">
<option value="">-- pick one --</option>
<option value="1">-- 1 --</option>
<option value="2">-- 2 --</option>
<option value="3">-- 3 --</option>
<option value="4">-- 4 --</option>
<option value="5">-- 5 --</option>
</select>
JavaScript
$(document).ready(function() {
$(".connSelect").change(function() {
var selVAL = $(this).val();
$("select option:selected" ).each(function() {
$("option[value=" + selVAL + "]").prop('disabled', true);
});
});
});