JSFiddle - React, Tailwind, and code Playground

HTML

<div style="position: absolute; left: 10px; top: 60px;">
    <img src="https://dl.dropbox.com/u/39640025/OMAA/Waves2PNG.png" width="331" height="96" border="0" alt="one" onClick="wave.change()" id="btn1" />
</div>

JavaScript

wave = new imageSwitch('btn1', 'https://dl.dropbox.com/u/39640025/OMAA/Waves2PNG.png', 'https://dl.dropbox.com/u/39640025/OMAA/Active/Waves%20Active%20PNG.png', 'https://dl.dropbox.com/u/39640025/MP3/Waves.mp3','https://dl.dropboxusercontent.com/u/39640025/OGG/Waves.ogg');

function imageSwitch(_imgID, _imgStart, _imgStop, _soundFileMp3, _soundFileOgg) {
    this.imgID = _imgID;
    this.imgStart = _imgStart;
    this.imgStop = _imgStop;
    this.song = new Audio();
    if (this.song.canPlayType("audio/mpeg"))
        this.song.src = _soundFileMp3;
    else 
        this.song.src = _soundFileOgg;
    this.song.loop = true;

    this.pos = 0;
    this.e;

    this.change = function () {
        if (this.pos == 0) {
            this.pos = 1;
            document.getElementById(this.imgID).src = this.imgStop;
            this.song.play();
        } else {
            this.pos = 0;
            document.getElementById(this.imgID).src = this.imgStart;
            this.song.pause();
        }
    }
}