Dropdown Disabling

HTML

<!-- Card 1 -->
<form method="POST" action="#" id="phase3">
  <input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
  <!-- Gender -->
  <div class="row registerRelationph3">
    <label class="fm-input"> Relation :</label>
    <select class="fm-input otherMenu" id="relation1" required>
      <option value=""> Please Select</option>
      <option value="Husband"> Husband </option>
      <option value="Wife"> Wife </option>
      <option value="Son"> Son </option>
      <option value="Daughter"> Daughter </option>
    </select>
  </div>
  <!-- END -->

  <!-- DOb -->
  <div class="row">
    <label class="fm-input" style="font-size: 10px;"> Date Of Birth :</label>
    <input type="text" id="dob" class="fm-inputph3" placeholder="Date of Birth" value="" required>
  </div>
  <!-- END dob -->
  <button class="btn btn-lg" type="submit"> Save Details <i class="fa fa-check-circle" ></i></button>
</form>
<!-- End card 1 -->

<!-- Card 2-->
<form method="POST" action="#" id="phase3">
  <input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
  <!-- Gender -->
  <div class="row registerRelationph3">
    <label class="fm-input"> Relation :</label>
    <select class="fm-input otherMenu" id="relation1" required>
      <option value=""> Please Select</option>
      <option value="Husband"> Husband </option>
      <option value="Wife"> Wife </option>
      <option value="Son"> Son </option>
      <option value="Daughter"> Daughter </option>
    </select>
  </div>
  <!-- END -->

  <!-- DOb -->
  <div class="row">
    <label class="fm-input" style="font-size: 10px;"> Date Of Birth :</label>
    <input type="text" id="dob" class="fm-inputph3" placeholder="Date of Birth" value="" required>
  </div>
  <!-- END dob -->
  <button class="btn btn-lg" type="submit"> Save Details <i class="fa fa-check-circle" ></i></button>
</form>
<!-- End card 2-->

<!-- Card 3-->
<form method="POST" action="#" id="phase3">
  <input type="hidden" name="_token"...

CSS

.other-menu option:disabled {
  color: blue;
}

JavaScript

var menus = document.querySelectorAll('.otherMenu');
for (let menu of menus) {
  menu.addEventListener('change', function() {
    var selectedOption = this.value;
    var thisMenu = this;
    var selectWife = document.querySelectorAll('.otherMenu option[value="Wife"]');
    var selectHusband = document.querySelectorAll('.otherMenu option[value="Husband"]');
    selectWife.forEach(function(option) {
      if(!(thisMenu === option.parentNode)){
        if(selectedOption === 'Wife'){
        	option.disabled = true;
        }
      }
    });
    selectHusband.forEach(function(option) {
      if(!(thisMenu === option.parentNode)){
        if(selectedOption === 'Husband'){
        	option.disabled = true;
        }
      }
    });
  });
}