Trying to update embedded data field with custom javascript

Hi,
Hoping someone can tell me what I'm doing wrong. I'm trying to use JavaScript to update an embedded data field.
My survey consists of a series of questions containing an audio clip which the respondents click to play and then answer the question. I want to count how many times they play the audio before moving on to the next question.
HTML


JavaScript
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/

var playCount = 0;
function incrPlayCount(){
playCount++;
};

document.getElementById('audioElm').addEventListener('play', incrPlayCount);

Qualtrics.SurveyEngine.addOnPageSubmit(function(type)
{
if(type == "next")
{
Qualtrics.SurveyEngine.setEmbeddedData("PlayCountQ1", playCount);
}
});

});

Survey Flow

New to Qualtrics and Javascript so any advice appreciated!