JSFiddle - React, Tailwind, and code Playground

HTML

<fieldset class="col-sm-6">
    <label for="FDestination">From</label>
    <select name="Location" id="Location" onchange="checkforblank()">
        <option value="Please Select">Please Select</option>
        <option value="Newport">Newport</option>
        <option value="Mahdi">London</option>
        <option value="Cardiff">Cardiff</option>
        <option value="Cilo">Brazil</option>
    </select>
</fieldset>
<fieldset class="col-sm-6">
    <label for="FDestination">To</label>
    <select name="LocationTo" id="LocationTo" onchange="checkforblank()">
        <option value="Please Select">Please Select</option>
        <option value="Cardiff">Cardiff</option>
        <option value="Mahdi">London</option>
        <option value="Newport">Newport</option>
        <option value="Cilo">Brazil</option>
    </select>
</fieldset>
<button type="button" id="submit">Click Me!</button>

JavaScript

var index_one;
var index_two;
$('#Location, #LocationTo').change(function (e) {

    index_one = $("#Location")[0].selectedIndex;
    index_two = $("#LocationTo")[0].selectedIndex;
});
$("#submit").click(function () {
    if ($("#Location>option").eq(index_one).text() == $("#LocationTo>option").eq(index_two).text()) {
        $('#Location, #LocationTo').css("border-color", "red");
    }
    
    else if($("#Location>option").eq(index_one).text() =="Please Select")
    {
        alert ("Select an option");
    }
      else if($("#LocationTo>option").eq(index_one).text() =="Please Select")
    {
        alert ("Select an option");
    }
    
    
    else {
        $('#Location, #LocationTo').css("border-color", "black");
    }
});