JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<script>
  AFRAME.registerComponent('audiohandler', {
    init: function() {
      let playing = false;
      let audio = document.getElementsByClassName('music');
      let audioEl
      this.el.addEventListener('click', () => {
        if (!playing) {
          audioEl = audio[Math.round(Math.random() * (audio.length - 1))]
          audioEl.play();
        } else {
          audioEl.pause();
          audioEl.currentTime = 0;
        }
        playing = !playing;
      });
    }
  })

</script>
<a-scene cursor="rayOrigin:mouse">
  <a-assets>
    <audio class='music' crossorigin="anonymous" src="https://upload.wikimedia.org/wikipedia/commons/b/bd/Bizet_-_Carmen_-_Toreador_Song_%28French%2C_Musopen%29.ogg"></audio>
    <audio class='music' crossorigin="anonymous" src="https://upload.wikimedia.org/wikipedia/commons/b/bb/Test_ogg_mp3_48kbps.wav"></audio>
    <audio class='music' crossorigin="anonymous" src="https://upload.wikimedia.org/wikipedia/commons/4/41/Mozart_-_Concerto_in_D_for_Flute_K.314.ladybyron.ogg"></audio>
    <audio class='music' crossorigin="anonymous" src="https://upload.wikimedia.org/wikipedia/commons/e/ed/Mozart_Eine_kleine_Nachtmusik_KV525_Satz_4_Rondo.ogg"></audio>
  </a-assets>

  <a-box color='blue' position="0  0 -2" audiohandler>

  </a-box>
</a-scene>