index.js

var noOfDrumButton = document.querySelectorAll(".drum").length;


for(var i=0;i<noOfDrumButton;i++)
{
 document.querySelectorAll(".drum")[i].addEventListener("click", function()
{
  var btn = this.innerHTML;
  handler(btn);
  animation(btn);
});
}

document.addEventListener("keydown",function(event){
      handler(event.key);
      animation(event.key);
})

function handler(key){

    switch (key) {
      case "w":
      var audio = new Audio("sounds/tom-1.mp3");
      break;

      case "a":
      var audio = new Audio("sounds/tom-2.mp3");
      break;

      case "s":
      var audio = new Audio("sounds/tom-3.mp3");
      break;

      case "d":
      var audio = new Audio("sounds/tom-4.mp3");
      break;

      case "j":
      var audio = new Audio("sounds/crash.mp3");
      break;

      case "k":
      var audio = new Audio("sounds/kick-bass.mp3");
      break;

      case "l":
      var audio = new Audio("sounds/snare.mp3");
      break;
      default:

    }
    audio.play();
}

function animation(key) {
  var bttn = document.querySelector("."+key);
  bttn.classList.add("pressed");
  setTimeout(function(){
    bttn.classList.remove("pressed");
  },100);
}