bootstrap multiselect several drop downs

Question

I have 2 drop downs. One is limited to 3 options and another has to be to one option. but, second drop down limitation is depend on first one. For example if I selected 3 items in one first drop down, all other items are disabled, that good, but in second drop down all items are disabled as well. I use different class multiselect and multiselect1. Maybe because both drop downs use same class multiselect-container. Here is the code

  $(document).ready(function () {
  $('#ddlSubCategory').multiselect({
      includeSelectAllOption: false,
      enableFiltering: false,
      buttonWidth: '200px',
      nonSelectedText: '---Select Sub Category---',
      onChange: function (option, checked) {
          var selectedOptions = $('.multiselect option:selected');
          var dropdown = $('.multiselect-container');

          if (selectedOptions.length >= 3) {
              // Disable all options that are not selected within the multiselect dropdown
              dropdown.find('input[type="checkbox"]').each(function () {
                  if (!$(this).is(':checked')) {
                      $(this).prop('disabled', true);
                      $(this).parent('li').addClass('disabled');
                  }
              });
          } else {
              // Enable all options within the multiselect dropdown
              dropdown.find('input[type="checkbox"]').each(function () {
                  $(this).prop('disabled', false);
                  $(this).parent('li').removeClass('disabled');
              });
          }

      }

     
  });

 //second drop down
  $('#ddlOccasion').multiselect({
      includeSelectAllOption: false,
      enableFiltering: false,
      buttonWidth: '200px',
      nonSelectedText: '---Select Occasion---',
      onChange: function (option, checked) {
          var selectedOptions = $('.multiselect1 option:selected');
          var dropdown = $('.multiselect-container');

          if (selectedOptions.length >= 2) {
              // Disable all options that are not selected within the multiselect dropdown
              dropdown.find('input[type="checkbox"]').each(function () {
                  if (!$(this).is(':checked')) {
                      $(this).prop('disabled', true);
                      $(this).parent('li').addClass('disabled');
                  }
              });
          } else {
              // Enable all options within the multiselect dropdown
              dropdown.find('input[type="checkbox"]').each(function () {
                  $(this).prop('disabled', false);
                  $(this).parent('li').removeClass('disabled');
              });
          }

          
      }


  });

});

                    <asp:ListBox ID="ddlSubCategory" runat="server"  CssClass="multiselect ddl" SelectionMode="Multiple">

</asp:ListBox>

td>
<asp:ListBox ID="ddlOccasion" runat="server" CssClass="multiselect1 ddl" SelectionMode="Multiple"> </asp:ListBox>