If you don't want to mess with HTML elements:

var audio = new Audio('audio_file.mp3');
audio.play();

function play() {
  var audio = new Audio('https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3');
  audio.play();
}

<button onclick="play()">Play Audio</button>

This uses the HTMLAudioElement interface, which plays audio the same way as the <audio> element.

If you need more functionality, I used the howler.js library and found it simple and useful.

<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js"></script>
<script>
    var sound = new Howl({
      src: ['https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3'],
      volume: 0.5,
      onend: function () {
        alert('Finished!');
      }
    });
    sound.play()
</script>

You could attach the audio element to the body (Firefox won't play it else) and detach it, when it stops. So you can be sure it doesn't exist in the DOM anymore.

If you do it this way,

• No, 10 sounds won't impact the performance because they're gone after playback.
• No, they won't stay in memory because they get detached.