禁用动态选择框的选择(下拉)选项

I have 2 dropdown groups as shown below

enter image description here

  • on clicking + button more groups will be created dynamically.
  • and the subcategory drop down is dynamically populated (from database) in the onchange event of category dropdown
    The problem is i want to avoid the duplication of selection in subcategory dropdown
    Any ideas given are welcome

EDIT 1:

$('.skill-subcategory').each(function(){
            //var value = $(this).val();
            var arr = [];
            var selectedValue=$(this).attr('selected').value;
             arr.push(selectedValue);

        });

    arr.each(function(i){
        //var thisValue= $(this).value;
        var selectedValuea = $(this).val();
        var otherDropdowns = $('.skill-category').not(this);
        otherDropdowns.find('option').prop('disabled', false); //reset all previous selection
        console.log("value:" + selectedValuea);
        otherDropdowns.find('option[value=' + selectedValuea + ']').prop('disabled', true);
    });

        });

      //if(thisValue == arr[i])
      //$(this).attr('disabled', true); 
    });

note: .skill-subcategory is the class used in subcategory dropdown
.skill-category is the class used in category dropdown