I'm trying to create an audio playlist from a <select> element. There is one critical piece to the puzzle that I'm missing; if a selection is playing, how can I stop it and replace the .src attribute with a new .src?

The problem seems to be rooted in the way I create the audio element...
if (window.Audio) { 
                auPlayer = new Audio; 
                } else {                 
    auPlayer = new HTMLAudioElement;             
The first thing I should do in the script is check for the existence of one of these audio elements and stop/pause it. I've looked for a way to search the DOM for these elements, but with no luck. The complete source is below; can anyone help me out of the mess I've created? Thanks in advance!

<!-- HTML -->
            <div class="well well-sm" id="au">
    <form id="frm_au" name="frm_au">
        <select id="sel_au" name="sel_au" size="3">
            <option data-mp3src="_bin/unforgettable.mpg" data-oggsrc="_bin/unforgettable.ogg" value="Unforgettable">Unforgettable</option>
            <option data-mp3src="_bin/at_last.mp3" data-oggsrc="_bin/at_last.ogg" value="At Last">At Last</option>
            <option data-mp3src="_bin/sunshineofmylife.mp3" data-oggsrc="_bin/sunshineofmylife.ogg" value="You Are The Sunshine Of My Life">You Are The Sunshine Of My Life</option>
            <option data-mp3src="_bin/astimegoesby.mp3" data-oggsrc="_bin/astimegoesby.ogg" value="As Time Goes By">As Time Goes By</option>
            <option data-mp3src="_bin/cantaloupeisland.mp3" data-oggsrc="_bin/cantaloupeisland.ogg" value="Cantaloupe Island">Cantaloupe Island</option>
            <option data-mp3src="_bin/Bethlehem.mp3" data-oggsrc="_bin/Bethlehem.ogg" value="O Little Town Of Bethlehem">O Little Town Of Bethlehem</option>
            <option data-mp3src="_bin/silentnite.mp3" data-oggsrc="_bin/silentnite.ogg" value="Silent Night">Silent Night</option>
            <option data-mp3src="_bin/letitsnow.mp3" data-oggsrc="_bin/letitsnow.ogg" value="Let It Snow!">Let It Snow!</option>                  
    <div id="myAudioContainer"></div>

<!-- JavaScript -->
<script src="../js/modernizr.custom.js"></script> <!-- yes, this is in the <head> of the page -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script><script>
function playAudio() {
    $('audio').remove(); // This is not working!
    var oggsrc = $('option:selected', this).data('oggsrc');
    var mp3src = $('option:selected', this).data('mp3src');
    console.log(oggsrc + ', ' + mp3src);
    var title = $(this).val();
    // Can play HTML5 audio?
    if (!Modernizr.audio) {
        fallbackHtml = "Your browser cannot natively play audio. <a href='" + mp3src + "'>Download " + title + " here</a>.";
    } else {
        if (Modernizr.audio.mp3) {
            audioSrc = mp3src;
        } else {
            if (Modernizr.audio.ogg) {
                audioSrc = oggsrc;
            } else {
                fallbackHtml = "We cannot determine what audio format is supported by your browser. <a href='" + mp3src + "'>Download " + title + " here</a>.";

    var auPlayer;
    if (window.Audio) {
    auPlayer = new Audio;
    } else {
        auPlayer = new HTMLAudioElement;
    auPlayer.src = audioSrc;
    auPlayer.autoplay = true;
    btnPause = document.createElement('button');
    $(btnPause).addClass('btn-warning').text('Pause ' + title);
    $(btnPause).on('click',function() {
$(document).ready(function() {