JQuery: создание формы в модальном окне с полем роли в качестве выбора и полем пользователя в качестве другого. Необходимо отключить роль, если она выбрана в другом выборе

Написание динамической формы, которая обновляет роль пользователя. Есть 2 роли лидера (которые могут быть предоставлены 1 человеку) и пользователь-член, а команда состоит из 4 человек (включая лидера). По форме они выбирают, кто станет лидером, и отдыхают как член. Таким образом, в форме, которую я связываю с помощью jQuery, используется раскрывающийся список для ролей с двумя вариантами лидера и члена. Как я могу отключить, если в любом выбранном лидере был выбран. Я могу ограничить эту проверку на внутреннем сайте, но я также хочу, чтобы если это можно было сделать на стороне внешнего интерфейса, было бы лучше.

Ниже приведен фрагмент:

function updateRole(){
  $('#update-table-body').empty();
    let body='';
   for(var i=0;i<members.length;i++)
                {     
                  body+='<tr>'; 
                  body+='<th><input type = "hidden" name = "member'+i+'" value = "'+members[i].id+'"/>'+members[i].name+'</th>';
                  body+='<td><div class = "control"><div class = "select">\
                    <select id = "role_'+i+'" name = "role'+i+'" onchange = "dissRole()">\
                      <option hidden></option>\
                      <option value = "1">Leader</option>\
                      <option value = "2">Member</option>\
                    </select></div></div></td>';    
                  body+='</tr>';
                }
        body+='<input type = "hidden" id = "count" name = "count" value = "'+members.length+'"/>';
  $('#update-table-body').append(body);
  $('.modal').addClass('is-active');
 }

и

function dissRole(){
    $(this)
        .siblings('select')
        .children('option[value = "1"]')
        .prop('disabled', true)
        .siblings().removeAttr('disabled');
}

Изменить 1: в обычном шаблоне HTML есть и другой вариант.