JSFiddle - React, Tailwind, and code Playground

HTML

<select id='first'>
    <option selected>Select</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>
<select id='second'>
    <option selected>Select</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>
<select id='third'>
    <option selected>Select</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>
<select id='fourth'>
    <option selected>Select</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
</select>

CSS

option:disabled {
    background-color:gray;
}

JavaScript

var ids = ['first', 'second', 'third', 'fourth'];
//put id names in list above of select elements that you want to have effect.
NodeList.prototype.forEach = HTMLCollection.prototype.forEach = Array.prototype.forEach;
var selected = [];
ids = makeid(ids);
var opts = find(ids);
updateS(opts);
massdisabler(opts);
assignFunc(ids, disabler);

function assignFunc(i, func) { //done
    var x;
    for (x = 0; x < i.length; ++x) {
        i[x].onchange = function () {
            func(this);
        };
    }
}

function disabler(i) {
    console.log(selected);
    updateS(opts);
    massdisabler(opts);
}

function makeid(i) { //done
    var o = [];
    i.forEach(function (v) {
        o.push(document.getElementById(v))
    });
    return o;
}

function find(ids) { //done
    var o = {};
    for (var i = 0; i < ids.length; ++i) {
        o[i] = {};
        ids[i].children.forEach(function (v, n) {
         o[i][n] = v;
        });
    }

    return o;
}

function massdisabler(op) { //done
    var y = Object.keys(op).length;
    for (var x = 0; x < y; x++) {
        var t = 0,
            l = Object.keys(opts[x]).length;
        for (var v = 0; v < l; v++) {
            t = op[x][v];

            if (selected.some(function (k) {
                if (t.value == k) {
                    return true;
                }
            })) {
                t.setAttribute("disabled", "disabled");
            } else {
                t.removeAttribute("disabled");
            }
        }
    }
}

function updateS(op) { //done
    var s = [],
        y = Object.keys(op).length;

    for (var x = 0; x < y; x++) {

        var t = 0,
            l = Object.keys(opts[x]).length;

        for (var v = 0; v < l; v++) {
            t = op[x][v];
            var yn = s.some(function (k) {
                if (t.value == k) {
                    return true;
                }
            });
            if (t.selected && (!yn)) s.push(t.value);
        }
    }
    selected = s;


}