Bootstrapからshown.bs.collapseイベントを受け取る方法は？

Question

Bootstrap 3.3.6からshown.bs.collapseイベントを受信できません。私はそれだと思うところイベントが発生していることを確認するために私bootstrap.jsをインストルメントしました：

私の文書で

this.$element.trigger('shown.bs.collapse') 
console.log("triggered shown.bs.collapse on #" + this.$element.attr("id")) 

準備ができて、私はjQueryと純粋なJSの両方を使用してイベントに登録しようとしました：

$('.panel-collapse').on('shown.bs.collapse', function() { 
    console.log("listener called"); 
}); 

...か...

var panels = document.getElementsByClassName("panel-collapse"); 
for (var i = 0; i < panels.length; ++i) { 
    console.log("adding event listener to #" + panels[i].getAttribute("id")); 
    panels[i].addEventListener("shown.bs.collapse", function() { 
     console.log("listener called"); 
    }); 
} 

JSのバージョンは、私はLを取り付けるてることを証明し、イベントがbootstrap.jsで焼成されたときにログに記録されているのと同じ要素のIDを記録しますistenerを正しい要素に置き換えます。しかし、それは決して呼び出されません。

これは見知らぬ人でも、これはすべてjsfiddleで動作しますが、アプリケーションにコードをコピーするときは動作しません。私はいくつかのパッケージのバージョンや設定がどこかで台無しになっていると思っています。何が原因でしょうか？

Answer 1

this Stack Overflow postによれば、カスタムjQueryイベントには ".addEventListener"を使用できません（例： "shown.bs.collapse"）。

jQueryの ".on"バージョンがうまくいかない理由はわかりません。