Playing music in a website [migrated]

My first post here.

<audio id="player" autoplay controls>
  <source src="song1.mp3" type="audio/mpeg">
</audio>

<script>
  var player = document.getElementById("player");
  var songs = ["song1.mp3", "song2.mp3"];
  var current = 0;

  player.addEventListener("ended", function () {
    current = (current + 1) % songs.length;  // wraps back to song 1 after song 2
    player.src = songs[current];
    player.play();
  });
</script>

I’m trying to play two songs back to back in autoplay. When I add this to my html it shows two control panels on the page. Trying to figure out why I get two?

Thanks,