「どこが間違っているか教えてください」カートの追加機能について

Question

現在ECサイトのcart機能を作成していますが、
console.logで返答がなく、どこでミスがあるのかがわかりません。

直すべきところを教えてください

ざっくりとした、質問というの重々承知なのですが、知恵をお借りしたいです。

<やりたいこと>
ボタンを押し、対象の情報を取得後console.log上で('productId:', productId, 'Action:', action)を表示したい

コード
var updateBtns = document.getElementsByClassName('update-cart')

for (var i = 0; i < updateBtns.length; i++) {
	updateBtns[i].addEventListener('click', function(){
		var productId = this.dataset.product
		var action = this.dataset.action
		console.log('productId:', productId, 'Action:', action)
	})
}

クラス名(update-cart)

{% for product in object_list %}
        <div class = "col-lg-4">
            <img class = "thumbnail" src = "{{product.imageURL}}">
            <div class="box-element product">
                <h6><strong>{{ product.name }}</strong></h6>
                <hr>
                <button data-product={{product.id}} data-action="add" class="btn 
                btn-outline-secondary add-btn update-cart">Add to Cart</button>
                <a class = "btn btn-outline-info" href = "/detail">View</a>
                <h4 style = "display: inline-block ;float: right">
                ${{ product.price|floatformat:2 }}</h4>
            </div>
        </div>
        {% endfor %}
コード

Comments

[m.ts10806]

このボタンってformタグに囲まれてたりしますか？
あと
forの前でconsole.log(updateBtns )
した場合に想定の要素が取れていますか？

[sk_3122]

こういうのは `var updateBtns = ` の前と後、とか click イベントに入った直後とかに
とにかく `console.log("001")` `console.log("002")` ... を仕込んで、
「どこまでのログなら出ているか」「どこから出ていないか」を確認して
どこの処理が問題なのかを見つけると良いと思います。