Buttons not functioning

[Bestpractice]

I'm trying to get a bit of code to work. I need one button that toggles control of audio to play and rewind but the script doesn't work.

 // Create Media object from src
  my_media = new Media(src, onSuccess, onError);

  // Play audio
  my_media.play();
  $('#playBtn').hide();
  $('#stopBtn').show();

  // Update my_media position every second
  if (mediaTimer == null) {
    mediaTimer = setInterval(function() {
      // get my_media position
      my_media.getCurrentPosition(
        // success callback
        function(position) {
          if (position > -1) {
            setAudioPosition((position) + " sec");
          }
        },
        // error callback
        function(e) {
          console.log("Error getting pos=" + e);
          setAudioPosition("Error: " + e);
        }
      );
    }, 1000);
  }
}

function pauseAudio() {
  if (my_media) {
    my_media.pause();
  }
}

function stopAudio() {
  $('#stopBtn').hide();
  $('#playBtn').show();
  if (my_media) {
    my_media.stop();
  }
  clearInterval(mediaTimer);
  mediaTimer = null;
}

function onSuccess() {
  console.log("playAudio():Audio Success");
}

function onError(error) {
  alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n');
}

function setAudioPosition(position) {
  // document.getElementById('audio_position').innerHTML = position;
}

Html --

<a href="#" class="btn-red btn-btm-right" id="playBtn" onclick="playAudio('S1-B.mp3');">
Listen <span class="glyphicon glyphicon-volume-up"></span>
</a>
<a href="#" class="btn-red btn-btm-right" id="stopBtn" onclick="stopAudio();" style="display:none;">
Stop <span class="glyphicon glyphicon-volume-off"></span>
</a>`

[The Diamonds]

Hi,

What libraries are you using?
I tried your code on latest Google chrome & Firefox browsers and I got an error "Media is not defined". So were is this 'Media' class?