getElementsByClassName not working but getElementById is

Question

The following code works (alert pops up):

var sound = document.getElementById(\"music\");
    sound.addEventListener(\"play\", function () {
    alert(\"play         


        

Answer 1

I'm pretty sure document.getElementsByClassName() will return a collection of elements, even if there is only one element with that class name on the page. So you're not actually applying the event listener to the audio element, but an array of elements.

If there will always be only one element of class sound, try var sound = document.getElementsByClassName("music")[0];.