Audio onended not functioning

Question

The audio plays when the user interacts with the window however when the audio ends it doesnt log 'audio ended'

let audio = new Audio();

window.onclick = () => {
  if (audio.paused) pickMusic().play();
};

audio.onended = () => {
  console.log("audio ended");
};

function pickMusic() {
  switch (Math.floor(Math.random() * 1)) {
    case 0:
      return (audio = new Audio("/music/gorp.mp3"));
      break;
    case 1:
      return (audio = new Audio("/music/gorp.mp3"));
      break;
  }
}

<p>Click anywhere!</p>

Answer 1

When you call new Audio(), it will override the previous audio which is already attached with onended event.

In this case, whenever you call new Audio(), you also need to initialize onended event once again

let audio = new Audio()

window.onclick = () => {
  if (audio.paused) pickMusic().play();
};

function pickMusic() {
  switch (Math.floor(Math.random() * 1)) {
    case 0:
      audio = new Audio("http://commondatastorage.googleapis.com/codeskulptor-assets/jump.ogg")
      audio.onended = () => {
        console.log("audio ended");
      };
      return audio;
    case 1:
      audio = new Audio("http://commondatastorage.googleapis.com/codeskulptor-assets/week7-brrring.m4a")
      audio.onended = () => {
        console.log("audio ended");
      };
      return audio;
  }
}

<p>Click anywhere!</p>