1

I want add a class to a panel heading using jQuery, but am unable to do that.

jQuery(".panel-deafult").each(function (index) {
    jQuery(this).children(".panel-heading:first").addClass("active");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="panel-default">
  <div class="panel-heading">
    <h3 class="panel-title">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1" href="#collapseOne1">Lorem ipsum dolor sit amet<i class="fa fa-angle-right pull-right"></i></a>
    </h3>
  </div>
</div>

2 Answers 2

0

what you need is on click event of the panel heading, to add the active class. Something along the lines of:

$('.panel-heading').click(function() {
  $(this).addClass('active');
});
0

Seems like what you're trying to do is to add the 'active' class to the first accordion tab for each accordion tab.

If that's right, here's what you'd do:

$('.panel-default').each(function(i,e){
var FirstPanel = $(e).children('.panel-heading')[0]; 
FirstPanel.addClass('active');
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.