JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://www.mastepinnelaand.nl/assets/js/chosen/chosen.jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.mastepinnelaand.nl/assets/js/chosen/chosen.css">

<div class="main_wrapper">
    <div class="wrapper">
      <select data-placeholder="Number row 1" style="width:350px;" multiple class="chzn-select">
        <option value=""></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>
        <option value="6">6</option>
      </select>
    
      <select data-placeholder="Number row 2" style="width:350px;" multiple class="chzn-select">
        <option value=""></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>
        <option value="6">6</option>
      </select>
    </div>
</div>

JavaScript

$('.chzn-select').chosen().change( function() {
  var selectedValue = $(this).find('option:selected').val();
  $(this).parent().parent().find('option[value="'+ selectedValue +'"]:not(:selected)').attr('disabled','disabled');
  $('.chzn-select').trigger("liszt:updated");
});