Twitter Bootstrap手风琴不同的标题

Question

我正在尝试用twitter bootstrap制作手风琴。它有效，但我想在面板打开时做出不同的标题。

这就是我所做的：

<div class="row acc-wizard">
  <div class="col-md-12" style="padding-right: 2em;">
    <div id="accordion" class="panel-group">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h4 class="panel-title">
            <a href="#accordion-<?php echo $i; ?>" data-parent="#accordion" data-toggle="collapse">
              <?php the_sub_field('titlu'); ?>
            </a>
          </h4>
        </div>
        <div id="accordion-<?php echo $i; ?>" class="panel-collapse collapse in">
          <div class="panel-body">
            <p><?php the_sub_field('continut'); ?></p>
          </div> <!--/.panel-body -->
        </div> <!-- /#accordion-i -->
      </div> <!-- /.panel.panel-default -->

    </div>
  </div>
</div>

jQuery的：

jQuery(function() {

    $('#accordion').on('show', function (e) {
         $(e.target).prev('.panel-heading').find('.panel-collapse').addClass('active');
    });

    $('#accordion').on('hide', function (e) {
        $(this).find('.panel-collapse').not($(e.target)).removeClass('active');
    });

});

谢谢。