JSFiddle - React, Tailwind, and code Playground
HTML
<p><a class="run" href="#">RUN</a></p>
<div class="insert"> </div>
<img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" class="imageOriginal"/>
CSS
.imageOriginal {
-webkit-transform: scale(0.1);
-moz-transform: scale(0.1);
-ms-transform: scale(0.1);
-o-transform: scale(0.1);
transform: scale(0.1);
-webkit-transition : all 0.5s ease-in-out;
-moz-transition : all 0.5s ease-in-out;
-ms-transition : all 0.5s ease-in-out;
-o-transition : all 0.5s ease-in-out;
transition : all 0.5s ease-in-out;
}
.imageAnimated {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
JavaScript
$(".run").click(function() {
var $this = $(".imageOriginal");
$this.appendTo('.insert');
setTimeout(function () {
$this.toggleClass("imageAnimated");
}, 0);
});