# 01 - JavaScript Drum Kit

    <script>
      (function () {
        window.addEventListener("keydown", playHandler);

        function playHandler(e) {
          const audio = document.querySelector(
            `audio[data-key="${e.keyCode}"]`
          );
          if (audio) {
            audio.currentTime = 0;
            audio.play();
          }

          const dom = document.querySelector(`div[data-key="${e.keyCode}"]`);
          if (dom) dom.classList.add("playing");
        }

        document.querySelectorAll(".key").forEach((key) => {
          key.addEventListener("transitionend", transitionedHandler);
        });
        function transitionedHandler(e) {
          if (e.propertyName === "transform") {
            e.target.classList.remove("playing");
          }
        }
      })();
    </script>