JSFiddle - React, Tailwind, and code Playground

HTML

<p id="good">My animation is fine!</p>
<p id="bad">My animation is bad!</p>

CSS

#good, #bad {
    opacity:0;
}

JavaScript

$( document ).ready(function() {
   $('#good').animate({opacity: 0.4}, 2000, false, null);
    $('#bad').animate({opacity: 1}, 5000, false, null);
});