Как добавить «активный» класс, чтобы открыть элемент аккордеона Bootstrap 3?

Question

Как добавить «активный» класс, чтобы открыть элемент аккордеона Bootstrap 3? В моем примере id добавляет «active», но не удаляет из других элементов. Я использую Bootstrap 3

<div class="panel-group accordions" id="accordion1"> 
    <div class="panel panel-custom"> 
     <div class="panel-heading"> 
      <h4 class="panel-title"> 
       <a data-toggle="collapse" data-parent="#accordion" href="#collapse1"> 
        Collapsible Group Item #1 
       </a> 
      </h4> 
     </div> 
     <div id="collapse1" class="panel-collapse collapse in"> 
      <div class="panel-body"> 
       .... 
      </div> 
     </div> 
    </div> 
    ... 
</div> 


jQuery('.accordions .panel-heading a[data-toggle="collapse"]').on('click', function() { 
    $('.accordions').find(jQuery('.panel-heading a[data-toggle="collapse"]')).removeClass('actives'); 
    $(this).addClass('actives'); 
}); 

Answer 1

Удалить JQuery из этой строки кода:

$('.accordions').find(jQuery('.panel-heading a[data-toggle="collapse"]')).removeClass('actives'); 

---

использования, как это:

$('.accordions').find('.panel-heading a[data-toggle="collapse"]').removeClass('actives'); 

---

Вы также можете сделать как это:

jQuery('.accordions .panel-heading a[data-toggle="collapse"]').on('click', function() { 
    jQuery('.accordions .panel-heading a[data-toggle="collapse"]').removeClass('actives'); 
    $(this).addClass('actives'); 
});