JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
  <img src="http://www.esa.int/var/esa/storage/images/esa_multimedia/images/2003/10/soho_image_28_october_2003/10098404-2-eng-GB/SOHO_image_28_October_2003_node_full_image_2.jpg">
  <img class="overlay" src="http://dawn.jpl.nasa.gov/multimedia/images/dawn-image-070911.jpg">
</div>

CSS

#container {
  position: relative;
}

#container .overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  transition: opacity 1s linear;
}

#container.revealed .overlay {
  opacity: 0;
}

JavaScript

setTimeout(function () {
	document.getElementById("container").className = "revealed";
}, 1000);