JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li><label class="leftField fl">Room 1</label><div class="rightField txtbg"><select name="fromBox" class="selectArea required" id="sel">
<option value="0">...Select...</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></div></li>
<li><label class="leftField fl">Room 2</label><div class="rightField txtbg"><select name="fromBox" class="selectArea required">
<option value="0">...Select...</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></div></li>
<li><label class="leftField fl">Room 3</label><div class="rightField txtbg"><select name="fromBox" class="selectArea required">
<option value="0">...Select...</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></div></li>
</ul>
JavaScript
$(function() {
$('#sel').change(function() {
var a = $(this).val();
$("select[name=fromBox] option").each(function() {
var b = $(this).val();
if (a == b) {
$(this).hide();
}
});
});