How to trigger a JQuery event when Audio has finished playing HTML5

Question

I'm trying to fathom out how to trigger an event when my audio has stopped playing. I am using the HTML5 <audio> tag. So far I can get the audio to give me its duration using the duration property, but I'm unable to do much with this at the moment. All's I want to do is pass a "play" string into a html() method so it doesn't keep displaying "pause" when my audio is finished playing.

Toggle function:

$("#toggleButton").on("click", function(evt) {
    if(audio.paused) {
        audio.play();
        $(this).html("Pause");
    }
    else {
        audio.pause();
        $(this).html("Play");
    }
});

I am also struggling to find documentation regarding audio methods and properties. I've tried searching "audio" on both the JQuery and Mozilla network and they return nothing back.

Answer 1

Try this:

audio.addEventListener('ended', function(){
    $("#toggleButton").html("Play");
});