JSFiddle - React, Tailwind, and code Playground

HTML

<audio id="audio1" src="http://www.vorbis.com/music/Epoq-Lepidoptera.ogg">
</audio>
<audio id="audio2" src="http://www.vorbis.com/music/Mists_of_Time-4T.ogg">
</audio>
<div id="audio1ctrl" class="audio-img" >
</div>
<div id="audio2ctrl" class="audio-img" >
</div>

CSS

.audio-img {
    background-image: url(http://sbir.nasa.gov/sites/all/themes/nasasbir/images/nasa-logo.png);
    display: block;
    width: 96px;
    height: 96px;
}

JavaScript

$("#audio1ctrl").click(function() {
	var audio = $("#audio1")[0];
  if (audio.paused) { audio.play(); }
  else { audio.pause(); }
});

$("#audio2ctrl").click(function() {
	var audio = $("#audio2")[0];
  if (audio.paused) { audio.play(); }
  else { audio.pause(); }
});