How to reduce audio lag using html5 audio tag

I am trying to add audio to my program but it won't play properly. It lags like a slow game and this is when testing locally.

I am thinking it may have to do with my javascript but I am not sure. Below is the javascript.

document.addEventListener('keypress', function(event) { var termdiv = document.getElementById("term_area");

    //what does this do exactly?
    //window.scrollTo(0,document.body.scrollHeight);

    //When enter is pressed, process input
    if(inFocus){
        if(event.keyCode == 13) {
            //process cmd here!!!
            backspace(true);
            console.log(cmd);
            try{
                cmds[cmd].execute();
            }
            catch(err){
                error();
            }

            backspace(true);
            cmd="";
            add_to_div(prompt); 
        }
        else{
            var ltr = String.fromCharCode(event.keyCode);
            turnOffBlinker();
            add_to_div(ltr)

            cmd += ltr;

        }
        termdiv.scrollTop = termdiv.scrollHeight;
        //window.scrollTo(0,document.body.scrollHeight);
    }
});

window.addEventListener('keydown', function(event) {
  switch (event.keyCode) {
    case 37: // Left

        break;

    case 38: // Up
        break;

    case 39: // Right
        break;

    case 40: // Down
        break;
  }
}, false);

function left_cursor(){
    var str = document.getElementById("term_area").innerHTML;

}

function backspace(blinkerOnly){
    var str = document.getElementById("term_area").innerHTML;

    if(blinkerOn){
        str = str.substring(0, str.length - 1);
        blinkerOn = false;
    }

    if(cmd.length != 0 && !blinkerOnly){
        str = str.substring(0, str.length - 1);
        cmd = cmd.substring(0, cmd.length - 1);
    }

    document.getElementById("term_area").innerHTML = str;
}


//Allow use of backspace to delete characters and not force it to go back a page
$(document).unbind('keydown').bind('keydown', function (event) {
    var doPrevent = false;
    if (event.keyCode === 8) {
        var d = event.srcElement || event.target;
        if ((d.tagName.toUpperCase() === 'INPUT' && 
             (
                 d.type.toUpperCase() === 'TEXT' ||
                 d.type.toUpperCase() === 'PASSWORD' || 
                 d.type.toUpperCase() === 'FILE' || 
                 d.type.toUpperCase() === 'EMAIL' || 
                 d.type.toUpperCase() === 'SEARCH' || 
                 d.type.toUpperCase() === 'DATE' )
             ) || 
             d.tagName.toUpperCase() === 'TEXTAREA') {
            doPrevent = d.readOnly || d.disabled;
        }
        else {
            doPrevent = true;
        }
        backspace(false);
        blinkerOn = false;
    }

    if (doPrevent) {
        event.preventDefault();
    }
});

all of the code is available here: https://github.com/farazoman/terminal_webapp/tree/master/js under term.js

HTML:

<audio autoplay>
                      <source src="../res/ts.ogg" type="audio/ogg">
                      <source src="../res/ts.mp3" type="audio/mpeg">
                    Your browser does not support the audio element.
                    </audio>

Thanks.