index.js

// detecting button press 
for(var i = 0 ; i < document.querySelectorAll(".drum").length ; i++){
    document.querySelectorAll("button")[i].addEventListener("click" , function(){

        var innerHtml = this.innerHTML;
        keyPress(innerHtml);
        buttonAnimation(innerHtml);
    });
}

// detecting key press 
document.addEventListener("keypress", function(event){

    keyPress(event.key);
    buttonAnimation(event.key);
})


function keyPress(keyPressed){
    switch(keyPressed){
        case "w":
            var tom1 = new Audio("sounds/tom-1.mp3")
            tom1.play();

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

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

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

        case "j":
            var snaare = new Audio("sounds/snare.mp3")
            snaare.play();
            break;

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

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

    }
}

function buttonAnimation(currentKey){

    var activeKey = document.querySelector("." + currentKey);
    activeKey.classList.add("pressed");

    setTimeout(function(){
        activeKey.classList.remove("pressed");
    }, 100);
}