JQUERY change attr after sound load

Question

I have a problem with mobile device.
After click event start sound and animation gif, but on mobile the sound start after animation, because maybe heavier.
How can I do?

var click = function(){
    $('.audio')[0].play();
    $('.change').attr('src', "animation.gif");

    setTimeout(function () {
    $('.change').attr('src', "stop.png");
    }, 600);
}

Answer 1

try this:

$(".audio").on("play", function (e) {
   $('.change').attr('src', "animation.gif");
   setTimeout(function () {
       $('.change').attr('src', "stop.png");
   }, 600);
});