jquery - Change text in animation -

as can see here try show countdown:

$('#countdown').text(3).fadein(4000).delay(500).fadeout(4000)                .text(2).fadein(4000).delay(5000).fadeout(4000)                .text(1).fadein(4000).delay(5000).fadeout(4000); 

https://jsfiddle.net/ns1ay9x6/

i not understand, why animation starts @ 1 instead of 3. wrong? thanks

use complete callback methods of fadeout() set text. .delay() works jquery methods use animation queue on same dom object , text() don't use queue.

$('#countdown')     .text(3)     .fadein(4000)     .delay(500)     .fadeout(4000, function() {         $(this)             .text(2);     })     .fadein(4000)     .delay(5000)     .fadeout(4000, function() {         $(this)             .text(1);     })     .fadein(4000)     .delay(5000)     .fadeout(4000); 

demo