자바스크립트 타입에러 getElementsByClassName 복수로 받는 것

var goodsBtn = document.getElementsByClassName("a");

goodsBtn.addEventListener("click",function(){
console.log("글그");
var firstList = doucument.querySelectorAll(".quote .field")[0];

var addListFild = document.createElement("div");
addListFild.setAttribute("class","field")
var addListSelect = document.createElement("input");
addListSelect.setAttribute("class","form")
addListSelect.setAttribute("placeholder","기기의 이름을 작성해주세요.")
addListFild.appendChild(addListSelect);

firstList.nextSibling(addListFild);
});

작성했으나 addEventListener 에서 타입에러가 났다.

어찌저찌 물어보니.. getElementsByClassName은 복수개가 들어가는 거고 한번에 이벤트 추가가 안된다고 들었다.

getElementsByClassName - 배열로 받아 인덱스를 지정하여 하나씩 잡아야 한다는 것!(for문으로 돌려야한다는 것)

예시)

//입력시 경고없앰
var valform = document.querySelectorAll('.valform');//all로 class잡음
var checkAlert = document.querySelectorAll('.check-alert');
for(var i=0; i <valform.length;i++){//for문으로 class의 length를 잡고
    valform[i].addEventListener("keyup",function(event) {//i의 이벤트를 발생시킴

    for(var i=0; i <checkAlert.length;i++){
        checkAlert[i].innerHTML= "";
    }

    }

결국 addEventListener은 되었으나 이벤트 리스너안에 내용이 좀 틀린걸로 나왔다..

공부 더해야지..코린이 열공하자...