JSFiddle - React, Tailwind, and code Playground

by Asim Shariff

HTML

<html>
  <head>
    <title>Audio test</title>
    <script>
      /**
        * Plays a sound using the HTML5 audio tag. Provide mp3 and ogg files for best browser support.
        * @param {string} filename The name of the file. Omit the ending!
        */
      function playSound(){
        var mp3Source = '<source src="https://www.soundjay.com/button/beep-01a.mp3" type="audio/mpeg">';
        var oggSource = '<source src="https://www.soundjay.com/button/beep-01a.wav" type="audio/ogg">';
        var embedSource = '<embed hidden="true" autostart="true" loop="false" src="https://www.soundjay.com/button/beep-01a.mp3">';
        document.getElementById("sound").innerHTML='<audio autoplay="autoplay">' + mp3Source + oggSource + embedSource + '</audio>';
      }
    </script>
  </head>

  <body>
    <!-- Will try to play bing.mp3 or bing.ogg (depends on browser compatibility) -->
    <button onclick="playSound('bing');">Play</button>  
    <div id="sound"></div>
  </body>
</html>