JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://gruntjs.com/img/grunt-logo.svg" alt="Grunt" class="filter">
<div class="bg filter"></div>

CSS

.filter {
  filter:blur(10px);
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -o-filter:blur(10px);
  -ms-filter:blur(10px);
    
  -webkit-transition: all 5.0s linear 1.0s;
  -moz-transition: all 5.0s linear 1.0s;
  -ms-transition: all 5.0s linear 1.0s;
  -o-transition: all 5.0s linear 1.0s;
  transition: all 5.0s linear 1.0s;
}
.filter.animae {
   filter:blur(0px);
  -webkit-filter:blur(0px);
  -moz-filter:blur(0px);
  -o-filter:blur(0px);
  -ms-filter:blur(0px);
}
.bg {
    display:inline-block;
    width:360px;
    height:424px;
    background:url(http://gruntjs.com/img/grunt-logo.svg);
}

JavaScript

$(".filter").addClass("animae");
window.setTimeout(function(){
  $(".filter").removeClass("animae");
}, 100)