[解決済み] Twitter Bootstrapのコラプシブル（アコーディオン）に開閉アイコンを追加する

質問

Bootstrapの簡単なバージョンです。 アコーディオン :

シンプルなアコーディオンです。 http://jsfiddle.net/darrenc/cngPS/

現在、アイコンは 下 となっていますが、アイコンのクラスを変更するにはどのようなJSを実装する必要があるか、どなたかご存知でしょうか。

<i class="icon-chevron-up"></i>

...そうすれば、それが 上 すると 拡張 に戻り、トグルで 下 に戻され、4番目のように？

どのように解決するのですか？

Bootstrap 3で解決策を探している人（私のような）のための答えです。

HTMLの部分です。

<div class="btn-group">
  <button type="button" class="btn btn-danger">Action</button>
  <button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo">
    <span class="glyphicon glyphicon-minus"></span>
  </button>
</div>
<div id="demo" class="collapse in">Some dummy text in here.</div>

jsの部分です。

$('.collapse').on('shown.bs.collapse', function(){
$(this).parent().find(".glyphicon-plus").removeClass("glyphicon-plus").addClass("glyphicon-minus");
}).on('hidden.bs.collapse', function(){
$(this).parent().find(".glyphicon-minus").removeClass("glyphicon-minus").addClass("glyphicon-plus");
});

アコーディオンの例です。

ブートパイア・アコーディオンの例