JSFiddle - React, Tailwind, and code Playground

HTML

<center>
    <img id="dog" src="http://openimage.interpark.com/2018/mall/new/tour/180829/tab_04_03.jpg" draggable="true" ondragstart="drag(event)" width="500" height="500">
</center>
<button onclick="myFunction()">Lets Rock</button>

CSS

img {
    opacity: 0;
    filter: alpha(opacity=40);
}

JavaScript

function fadeIn(el) {
    el.style.opacity = 0;
    var tick = function () {
        el.style.opacity = +el.style.opacity + 0.01;
        if (+el.style.opacity < 1) {
            (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16)
        }
    };
    tick();
}

window.myFunction = function () {
    var el = document.getElementById("dog");
    fadeIn(el);
}