JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/ui-lightness/jquery-ui.css">
<select name="vendor" id="vendor_select_from">
    <option  value="Apple" id="id0">Apple</option>
    <option  value="Vector Resources, Inc" id="id1">Vector Resources, Inc</option>
    <option  value="Dell, Inc." id="id2">Dell, Inc.</option>
    <option  value="Amazon.com" id="id3">Amazon.com</option>
</select>

<select name="vendor" id="vendor_select_from2">
    <option  value="Apple" id="id02">Apple</option>
    <option  value="Vector Resources, Inc" id="id12">Vector Resources, Inc</option>
    <option  value="Dell, Inc." id="id22">Dell, Inc.</option>
    <option  value="Amazon.com" id="id32">Amazon.com</option>
</select>

CSS

div {
    color: blue;
    padding: 20px;
    
}

JavaScript

$('#vendor_select_from').change(function() {
    var selected = $(':selected', this)[0].id + 2;
    $('#' + selected).attr('disabled','disabled')
        .siblings().removeAttr('disabled');
    
    var $select2 = $('#vendor_select_from2');
    if(selected == $(':selected', $select2)[0].id) {
        $select2.val('');
    }
}).trigger('change');