JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="circles">
            <li>
                <div class="outerContainer">
                    <div class="innerContainer">
                        <p>Circle 1</p>
                        <span class="progressBar"></span>
                    </div>
                </div>
                <div class="level"><span>45</span></div>
            </li>
            <li>
                <div class="outerContainer">
                    <div class="innerContainer">
                        <p>Circle 2</p>
                        <span class="progressBar"></span>
                    </div>
                </div>
                <div class="level"><span>90</span></div>
            </li>
            <li>
                <div class="outerContainer">
                    <div class="innerContainer">
                        <p>Circle 3</p>
                        <span class="progressBar"></span>
                    </div>
                </div>
                <div class="level"><span>75</span></div>
            </li>
        </ul>

CSS

body {
    background: blue;
}

#circles {
	text-align: center;
	margin: 100px 0;
}

li {
    display: inline-block;
	margin: 0 10px;
	position: relative;
}

.outerContainer {
	position: relative;
	display: table;
	height: 96px;
	width: 96px;
	overflow: hidden;
	background: #fff;
	border: 2px solid #fff;
	
  -webkit-border-radius: 50px;
          border-radius: 50px;
}

.innerContainer {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

p {
	color: #000;
	width: 96px;
	position: relative;
	z-index: 2;
}

.progressBar {
	display: block;
	width: 100%;
	height: 0;
	position: absolute;
    bottom: 0;
	left: 0;
	background: #ec6730;
}

JavaScript

$(function() {
	$("#circles li").hover(function(){
		var thisElement = $(this);
		var level = $(this).find(".level").text();
		var elementHeight = $(this).find(".outerContainer").height();		
		level = (level/100)*elementHeight;
		
		$(thisElement).find(".progressBar").stop().animate({
			height: level
		}, 300);
	}, function() {
		var thisElement = $(this);

		$(".progressBar").stop().animate({
			height: 0
		}, 300);
	});
});