Can somebody help me out for the following multiple drop-down binding problem?

Question

I want to bind the second drop-down based on first drop-down's selected option.

Also when add second dropdown first selected system should be disabled.

Html for drop-down is as below:

  <div class="row mb-2 assign-system-login-type">
     <div class="col-6">
         <label for="addSystem">Add System</label>
         <select class="form-control p-1 addSystem">
             <option value="">System A</option>
             <option value="">System B</option>
             <option value="">System C</option>
         </select>
     </div>
     <div class="col-6">
         <label for="addTags">LoginType</label>
         <select class="form-control p-1 addTags" required>
         </select>
     </div>
 </div>

In Js I had bind login type drop-down on select of system type. But it works only for first time, I want this solution for after adding multiple drop-downs:

 $(document).ready(function () {
     initializeSelect2();
 });

 function initializeSelect2() {
     $('select.addTags, select.addSystem').select2({
         width: '100%',
         maximumInputLength: 20
     });
 }
  $('.assign-system-login-type').on('select2:select', function (e) {
     $(".addTags").empty()
     var logintypeList = @Html.Raw(Json.Serialize(logintypeList));
     var optionno = 0;
     $(logintypeList).each(function (index) {
         if (e.params.data.id == this.systemType) {
             var $newOption = $("<option selected='selected'></option>").val(index).text(this.name)
             $(".addTags").append($newOption).trigger('change');
             optionno = optionno + 1;
         }
     });
     if (optionno == 0) {
         var $newOption = $("<option selected='selected'></option>").val("").text("No Options")
         $(".addTags").append($newOption).trigger('change'); 
     }
 }); 
 function addAssignSystemLoginType() {
     var maxDropdowns = 3;
     var currentDropdowns = $('.assign-system-login-type').length;

     if (currentDropdowns < maxDropdowns) {
         var newDropdowns = `
                     <div class="row mb-2 assign-system-login-type">
                         <div class="col-6">
                             <label for="addSystem">Add System</label>
                             <select class="form-control p-1 addSystem">
                                 <option value="">System A</option>
                                 <option value="">System B</option>
                                 <option value="">System C</option>
                             </select>
                         </div>
                         <div class="col-6">
                             <label for="addTags">LoginType</label>
                             <select class="form-control p-1 addTags" required>
                                 <option value="Tag1">Admin</option>
                                 <option value="Tag2">User</option>
                             </select>
                         </div>
                     </div>
                 `;
         $('#assignSystemLoginTypeContainer').append(newDropdowns);
         initializeSelect2();
     }
 }