JSFiddle - React, Tailwind, and code Playground

by danheberden

HTML

<div id="count"></div>    
<div class="value-container">a</div>
    <div class="value-container">b</div>
    <div class="value-container">c</div>
    <div class="value-container">d</div>

CSS

#count {
    font-size:54px;
    padding:30px;
    border-radius:10px;
    background:#EEE;
    margin:20px;
    text-align: center;
}
div.value-container {
    border:1px solid #CCC;
    padding:2px;
    text-align:center;
    margin:2px;
}

JavaScript

// #4468
var count = 5, $count = $( '#count' );
( function loop() { 
    if ( !count-- ) {
        $count.html( "GO" );
        $('.value-container:not(:first)').slideUp( 500 );
    }else {
        $count.html( count );
        setTimeout( loop, 500 );
    }    
    
})();