为什么'addEventListener'只适用'for循环'

Question

为什么'addEventListener'只适用于'for loop'？

我的codepen：

for循环（工作）：

var isPurple = false;

for(var i = 0; i < btn.length; i++){
 btn[i].addEventListener("click", function()
 { if(isPurple){
    document.body.style.backgroundColor = "white";
  } else {
   document.body.style.backgroundColor =    "pink"; 
 }
  isPurple = !isPurple;

 }); }

有课（不起作用）：

btn.addEventListener("click", function(){
document.body.classList.toggle("purple");  
})

常规课程（不起作用 - “不是一个功能”）：

btn.addEventListener("click", function(){
document.body.style.backgroundColor = "pink";

})

P.S 另外我不知道为什么，但也有for循环，它只能在codepen中工作，如果我在它的控制台中这样做。