добавить класс, когда у ребенка есть класс jquery

Question

У меня есть форма, которая добавляет класс «selected-role» к активной вкладке, и я пытаюсь изменить цвет границы родительского элемента, когда на вкладке формы есть класс «selected-role». Как мне добавить его только на «активную» вкладку? сейчас он добавляет цвет рамки ко всем трем вкладкам

<div class="register_checkbox_label-container col">
    <label tabindex="0" for="register_checkbox_one" class="form_checkbox_label form_checkbox_label--role selected-role" id="default-role" data-role="one">
        One
    </label>
</div>

<div class="register_checkbox_label-container col">
    <label tabindex="0" for="register_checkbox_two" class="form_checkbox_label form_checkbox_label--role" data-role="two"  data-offset="0">
        Two
    </label>
</div>

<div class="register_checkbox_label-container col">
    <label tabindex="0" for="register_checkbox_three" class="form_checkbox_label form_checkbox_label--role" data-role="three"  data-offset="0">
        Three
    </label>
</div>

Jquery:

if($('.form_checkbox_label').hasClass('selected-role')){
      $(this).find('.register_checkbox_label-container').addClass('border-fuschia');
    }

Answer 1

Вам не нужно все oop, чтобы достичь этого. Просто выберите родительский элемент с помощью селектора :has(), чтобы соответствовать только элементам с данным дочерним элементом:

$('.register_checkbox_label-container:has(.selected-role)').addClass('border-fuschia');

.border-fuschia {
  border: 1px solid fuchsia;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="register_checkbox_label-container col">
  <label class="selected-role">One</label>
</div>
<div class="register_checkbox_label-container col">
  <label>Two</label>
</div>
<div class="register_checkbox_label-container col">
  <label>Three</label>
</div>

Обратите внимание, что я удалил несущественные части HTML выше, чтобы сделать пример короче.