JSFiddle - React, Tailwind, and code Playground

HTML

<div id="lol">text</div>

CSS

#lol {
padding:20px; background-color:#FF0000; color:#FFF; font-size:15px; font-family:arial; width:300px; opacity:1; filter:alpha(opacity=100); position:relative;
   
    /*-webkit-backface-visibility:hidden;*/
}

JavaScript

$('#lol').hover(function() {

        $(this).stop().animate({opacity:0.5});

    },function() {

        $(this).stop().animate({opacity:1});

    });