JSFiddle - React, Tailwind, and code Playground

by Jimmy Sawczuk

HTML

<div id="container">
    <div style="background: #F00;" id="test1">test</div>
    <div style="background: #00F;" id="test2">test 2</div>
    <div style="background: #0F0;" id="test3">test 3</div>
</div>

JavaScript

var queue = [];

$('#container > *').each(function() {
    queue.push(function(cb) { 
        $('#' + $(this).attr('id')).fadeOut('slow', function() { 
            cb(); 
        }) 
    });
});
                            

function animate_queue(my_queue) {
    func = my_queue.pop();
    
    console.debug(my_queue.length);
    
    func(function() {
        console.debug('test');
        animate_queue(my_queue);
    });
}

animate_queue(queue);