JSFiddle - React, Tailwind, and code Playground
HTML
<div class="fademe">
</div>
<button>CLICK ME</button>
CSS
.fademe {
width:100px;
height:100px;
background:red;
}
.fademe.animated {
animation:fade-in 1.5s ease;
}
@keyframes fade-in {
0% {opacity: 0;}
100% {opacity: 1;}
}
JavaScript
$('button').click(function() {
$(".fademe").addClass('animated');
setTimeout(function() {
$(".fademe").removeClass('animated');
}, 1500);
});