JSFiddle - React, Tailwind, and code Playground

HTML

<div id="featured">
    <div class="wrapper">
        <ul>
            <li class="block">
                <div>aaa</div>
            </li>
            <li class="block">
                aaa
            </li>
            <li class="block">
                aaa
            </li>
            <li class="block">
                aaa
            </li>
            <li class="block">
                aaa
            </li>
        </ul>
    </div>
</div>

CSS

/* -------------------------------------------------------- 
    Wrapper
-------------------------------------------------------- */
.wrapper {
    width: 960px;
    margin: 0 auto;
    position: relative;
}




/* -------------------------------------------------------- 
  Header
-------------------------------------------------------- */
#top_bar { height: 10px; }
#header {
    height: 219px;
}
    #header h1 a {
        float: left;
        
        display: block;
        width: 400px;
        height: 230px;
        text-indent: -9999px;
        position: absolute;
        top: -10px;
        left: -25px;
        z-index: 10;
    }
    #header .banner {
        width: 478px;
        height: 66px;
        float: right;
        text-align: center;
        padding-top: 5px;
        margin: 29px 10px 24px 0px;
    }
    
    #main_nav {
        width: 644px;
        height: 73px;
        float: right;
    }
        #main_nav ul {
            
        }
            #main_nav ul li {
                
                display: inline;
            }
                #main_nav ul li a {
                    height: 49px;
                    position: relative;
                    z-index: 100;
                    display: block;
                    text-indent: -9999px;
                    float: left;
                    margin: 12px 0px 0px 0px;
                }
                    #main_nav ul li#home a { width: 89px; margin-left: 12px; }
                        #main_nav ul li#home a:hover { background-position: bottom left; }
                    #main_nav ul li#new_slot_games a { width: 180px; }
                        #main_nav ul li#new_slot_games a:hover { background-position: bottom left; }
                    #main_nav ul li#reviews a { width: 110px; }
                        #main_nav ul li#reviews a:hover { background-position: bottom left; }
                    #main_nav ul li#sotw a { width: 90px; }
                        #main_nav ul li#sotw a:hover {...

JavaScript

$('#featured li.block div').click(function() {
    var times = 10;
    $(this).bind('roll', function() {
        $(this).animate({
            top: "0"
        }, 300, function() {
            $(this).css('top', '4px').animate({
                top: "4"
            }, 300, function() {
                if (--times) {
                    $(this).trigger('roll');
                }
            });
        });
    }).trigger('roll');
});