It's pretty simple to get started really:

function playSound(url) {
    var a = new Audio(url);
    a.play();
}

Use that as whatever event handler you want for your application. Of course, I'd hope you'd want to do more than just play (for example, maybe pause would be good too?), but it's a start.

I believe you have to pass the extension here as well. This does work because this server is CORS enabled.

form.addEventListener("submit", myFunction)
function myFunction(e) {
  e.preventDefault();
  audio.src = 'https://bobzilla07.github.io/Music_Tap/' + myInput.value + '.mp3';
  audio.play();
}

audio { display:none;}

<form id="form">
  <input id="myInput" value="Panic-Song">
  <input type="submit">
</form>
<audio controls id="audio"></audio>

Song list

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>

Audio works correctly cross server without an additional issues, see the example below.

There can be a number of reasons why this wouldn't work:

• Check the network tab to make sure the wav file is in the correct location.
• Check the console for any warning messages of why it couldn't load.
• Check this question/answer for additional debugging steps.
• Post back with the URL that you're trying to grab from, or additional information about the request.

async function playAudio() {
  var audio = new Audio('https://www2.cs.uic.edu/~i101/SoundFiles/StarWars60.wav');  
  audio.type = 'audio/wav';

  try {
    await audio.play();
    console.log('Playing...');
  } catch (err) {
    console.log('Failed to play...' + err);
  }
}

<a href="#" onclick="playAudio()">Play Audio</a>

Perhaps something like

<p><a href="#" onclick="new Audio('horse.mp3').play()">Click here to play the sound</a></p>

Of course, inline attributes are discouraged - you can do the same thing in a JavaScript file if you prefer.