"this" keyword in function at Javascript

Question

I am adding an active class to the current button that is clicked. The active class change the background color of the button to green. Why replacing the this keyword with btn[i], it doesn't work in this code. However, both will be inside the for loop?

var btns = document.getElementsByClassName("btn");
for (var i = 0; i < btns.length; i++) {
  btns[i].addEventListener("click", function(){
    var current = document.getElementsByClassName("active");
    current[0].className = current[0].className.replace(" active", "");
    this.className += " active"; // why replacing "this" with btns[i] won't work!
  });
}