JSFiddle - React, Tailwind, and code Playground
HTML
<div class="transition"></div>
CSS
div {
width: 200px;
height: 200px;
border: 1px solid #333;
margin: 20px;
}
div.transition {
height: 100px;
width: 100px;
background-color: #ffffff;
transition: background-color 1s linear;
-moz-transition: background-color 1s linear;
-o-transition: background-color 1s linear;
-webkit-transition: background-color 1s linear;
}
div.animated {
background-color: #ff0000;
}
JavaScript
$(document).ready(function() {
$('.transition').addClass('animated');
});