JSFiddle - React, Tailwind, and code Playground

HTML

<div class="statistics">Statistics</div>
<ul class="statisticsGraph">
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
    <li>
        <div class="statLine"><span class="statCircle"></span><span class="number"></span>
        </div>
    </li>
</ul>

CSS

.statistics {
    position: relative;
    display: block;
    width: 100%;
    border-bottom: 1px solid #000;
    height: 30px;
    background: #fff;
    background: #000;
    color: #fff;
    padding:20px 20px;
    font-size: 20px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
}
ul.statisticsGraph li {
    position: relative;
    display: inline-block;
    float: right;
    width: 10%;
    margin: 10px 5px 0 0;
    height: 230px;
}
.statLine {
    position: absolute;
    display: block;
    background: red;
    width: 5px;
    bottom: 0px;
    overflow:visible !important;
}
.statCircle {
    position: relative;
    display: block;
    width: 8px;
    height:8px;
    left: -8px;
    border-radius: 50%;
    background: yellow;
    border: 6px solid red;
}
.number {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 15px;
    color: #000;
    padding: 4px;
    font-size: 18px;
    top: -60px;
    left: -17px;
    border-radius: 3px;
    border: 1px solid #ffd800;
}

JavaScript

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

$('.statistics').on('click', function () {
    $('.statLine').each(function () {
        $(this)
            .animate({
                'height': '0'
                }, 
                function () {
                    $(this)
                        .animate({
                            'height': getRandomInt(0, 200)
                        }, function an(){
                            $(this).children('.number').text($(this).height());
                        });
                });
    });
});