JSFiddle - React, Tailwind, and code Playground

by koenpunt

HTML

<div id="foo" class="hidden">
    My test div
</div>

CSS

div {
    -webkit-transition-property: all;
    -webkit-transition-duration: 2s;
}       

div.hidden {
    display: none;
    opacity: 0;
}    

div.from {
    opacity: 0;
}

JavaScript

var e = document.getElementById("foo");
e.className = "from";
window.webkitRequestAnimationFrame(function(t) {
    e.className = null;
});