html - ブートストラップ アコーディオン

Question

ブートストラップ用の transition.js プラグインを使用してアコーディオンを作成しています。

ここで、全体で要素の展開と折りたたみをトリガーしたいのでpanel-heading、 a タグを要素の外に移動しました。

これまでのところこれは正常に機能しますがpanel-heading、拡張をトリガーしないボタンもあります。どうすればそれを達成できますか？

<div class="panel panel-default">
  <a class="accordion-toggle" data-toggle="collapse" data-parent="#gameslist" href="#collapse1">
    <div class="panel-heading row">
      <div class="col-xs-4">
        <div class="panel-title">Title</div>
      </div>
      <div class="col-xs-4">
        <button type="button" class="btn btn-danger btn-xs">This button should not trigger the accordion</button>
      </div>
    </div>
  </a>
</div>