javascript - Javascript/Babel で HTMLCollection を反復処理する方法

Question

webpack と Babel を使用して Web サイトをセットアップしようとしています。jQueryを使用して、テーブル内のすべてのアイテムに「onclick」イベントを割り当てようとしています。getElementsByClassNameHTMLCollection を返すを使用してすべての「クリック可能な行」テーブルの行アイテムを選択していますが.length、それを呼び出すと 0 が返されます。コレクションをコンソールに出力すると、その中にアイテムがあることが示されます。これは、それがバベルの問題だと私に思わせます。

配列に変換しようとしました-配列は空です。document.querySelectorAll();空の NodeList と...演算子を返すものを試して.forEach()みHTMLCollection.prototype.forEach = Array.prototype.forEach;ました。

私が使用しているコードは次のとおりです。

$('document').ready(getTableRows);

function getTableRows() {
    let tableRows = document.getElementsByClassName("clickable-row");
    console.log(tableRows);
    console.log("Length of this collection = " + tableRows.length);
    let array = Array.from(tableRows);
    console.log("Converted to array");
    console.log(array);
}

Google Chrome のコンソールから返される結果は次のとおりです。

HTMLCollection []
    0: tr.clickable-row
    1: tr.clickable-row
    2: tr.clickable-row
    3: tr.clickable-row
    4: tr.clickable-row
    5: tr.clickable-row
    6: tr.clickable-row
    7: tr.clickable-row
    8: tr.clickable-row
    9: tr.clickable-row
    length: 10
    __proto__: HTMLCollection

Length of this collection = 0

Converted to array
[]
    length: 0
    __proto__: Array(0)

私はjsfiddleで同じことを再作成しようとしましたが、同じ動作を引き起こさなかったので、Babel/webpackのことだとさらに思いました。 http://jsfiddle.net/h2emxdf1/2/

混同していたら申し訳ありませんが、このwebpack全体に関しては初心者です。