JSFiddle - React, Tailwind, and code Playground

HTML

<audio id="audio">Your browser doesn't support the audio element. :(</audio>

<button id="play">
 Play BBC
</button>

<button id="stop">
STOP
</button>

<h1 id="loader" style="visibility: hidden">
  Loading...
</h1>

JavaScript

const radioSource = "http://bbcmedia.ic.llnwd.net/stream/bbcmedia_radio1_mf_q?s=1554757026&e=1554771426&h=edc3fd85a3618ce03f37a105f5d11448";

const resetAudio = "RESET_ME_BUT_FLASH";

const loader = document.getElementById('loader');

const audio = document.getElementById('audio');

audio.addEventListener('loadstart', () => {
  if (audio.src !== resetAudio) {
    loader.style.visibility = "visible";
  }
});

audio.addEventListener('playing', () => {
  loader.style.visibility = "hidden";
});

audio.addEventListener('error', () => {
  loader.style.visibility = "hidden";
});

document.getElementById('play').addEventListener('click', (evt) => {
  audio.src = radioSource;
  audio.play();
})

document.getElementById('stop').addEventListener('click', (evt) => {
  audio.src = resetAudio;
  audio.pause();
  audio.load();
})