JSFiddle - React, Tailwind, and code Playground

HTML

<div id="global"></div>
<div id="music_right">
    <div class="thumbnail" id="paparazzi">
        <a class="playback">
            <img class="play" src="http://www.lucisz.com/imgs/play.png" />
        </a>
        <audio>
            <source src="https://upload.wikimedia.org/wikipedia/commons/c/c8/Example.ogg" type="audio/ogg" />
        </audio>
    </div>
    <div class="thumbnail" id="danceinthedark">
        <a class="playback">
            <img class="play" src="http://www.lucisz.com/imgs/play.png" />
        </a>
        <audio>
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_danceinthedark.ogg" type="audio/ogg" />
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_danceinthedark.mp3" type="audio/mpeg" />
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_danceinthedark.wav" type="audio/x-wav" />
            Your browser does not support HTML5 audio.
        </audio>
    </div>
    <div class="thumbnail" id="bornthisway">
        <a class="playback">
            <img class="play" src="http://www.lucisz.com/imgs/play.png" />
        </a>
        <audio>
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_bornthisway.ogg" type="audio/ogg" />
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_bornthisway.mp3" type="audio/mpeg" />
            <source src="http://www.minimalpluscreative.com/newclients/fernandogaribay/audio/fernando_garibay_bornthisway.wav" type="audio/x-wav" />
            Your browser does not support HTML5 audio.
        </audio>
    </div>
</div>

CSS

.thumbnail {
    width:100px;
    height:100px;
    margin:5px;
    float:left;
    background:#999fff;
    cursor:pointer;
}
#global {
    width:41px;
    height:22px;
    background:url(http://download.p4c.philips.com/sca/sca/090211/090211094040_26345.gif);
    cursor:pointer;
}

JavaScript

// Music thumbnails
$('.play').hide();
$('.thumbnail').hover(function() {
    $('.play', this).stop(true, true).fadeToggle(400);
});

// Audio player function with add/remove class that isn't working
/*var curPlaying;
    $(function() {
        $(".playback").click(function(e){
            e.preventDefault();
            var song = $(this).next('audio')[0];
            song.toggleClass("playing");
            if(song.paused){
                song.play();
                if(curPlaying) $("audio", "#"+curPlaying)[0].pause();
            } else {
                song.pause();
                }
            curPlaying = $(this).parent()[0].id;
        });
    });*/
//Audio player function that works
var curPlaying;
$(function() {
    $(".playback").click(function(e) {
        e.preventDefault();
        var song = $(this).next('audio')[0];
        if (song.paused) {
            song.play();
            if (curPlaying) $("audio", "#" + curPlaying)[0].pause();
        } else {
            song.pause();
        }
        curPlaying = $(this).parent()[0].id;
    });
});