btn.addEventListener is not a functionが解決できない

前提・実現したいこと

取得した要素をクリックしたらアラートが出るようにしたい

該当のソースコード

javascript
1window.onload = function() {
2  var btn = document.getElementsByClassName("remove-btn");
3  btn.addEventListener('click', function(){
4    window.alert("ok");
5  }, false);
6};

HTML
1<div class="remove-btn-area">
2  <p class="remove-btn"><i class="fas fa-info-circle"></i>削除依頼について</p>
3</div>

このように記述し、実際にクリックしてみるとTypeError: btn.addEventListener is not a function　at window.onload というエラーが出てしまいます。

どのようにすれば解決できるか教えていただけないでしょうか。
よろしくお願いいたします。

行動規範の内容に同意します

回答1件

ベストアンサー

getElementsByClassNameは取得するものが複数だからそれぞれ処理する必要があります。
一つ目だけでよいなら下記のようにしてください。

js
1// var btn = document.getElementsByClassName("remove-btn");
2//                                                         ↓
3   var btn = document.getElementsByClassName("remove-btn")[0];