css3 - CSS Trick with jQuery -

today april fools day, want trick visitors css3 blur. blur should last 2 seconds , turn normal in 1 second.

but problem code didn't executed expected.
page showing: loaded > blur > normal > blur
page expected: loaded > blur > normal > blur

snippet:

$(document).ready(function() {      $(".apffilter").addclass("animae");            window.settimeout(function(){          $(".apffilter").removeclass("animae");     }, 3000);  });

.apffilter {    filter:blur(1px);    -webkit-filter:blur(1px);    -moz-filter:blur(1px);    -o-filter:blur(1px);    -ms-filter:blur(1px);          -webkit-transition: 2.0s linear 1.0s;    -moz-transition: 2.0s linear 1.0s;    -ms-transition: 2.0s linear 1.0s;    -o-transition: 2.0s linear 1.0s;    transition: 2.0s linear 1.0s;  }    .apffilter.animae {     filter:blur(0px);    -webkit-filter:blur(0px);    -moz-filter:blur(0px);    -o-filter:blur(0px);    -ms-filter:blur(0px);  }

<div class="apffilter">      <img src="http://www.etnforum.com/templates/thewei-zz3/images/etndiamond2015.png" /><br /><br />      happy april fool's day!  </div>

here js works fine. replace addclass event.

jquery

$(document).ready(function () {         $(".apffilter").removeclass("animae");          window.settimeout(function () {             $(".apffilter").addclass("animae");         }, 3000);     }); 

for op request added demo here well!

        $(document).ready(function () {              $(".apffilter").removeclass("animae");                window.settimeout(function () {                  $(".apffilter").addclass("animae");              }, 3000);          });

.apffilter {    filter:blur(0px);    -webkit-filter:blur(1px);    -moz-filter:blur(1px);    -o-filter:blur(1px);    -ms-filter:blur(1px);          -webkit-transition: 2.0s linear 1.0s;    -moz-transition: 2.0s linear 1.0s;    -ms-transition: 2.0s linear 1.0s;    -o-transition: 2.0s linear 1.0s;    transition: 2.0s linear 1.0s;  }    .apffilter.animae {     filter:blur(1px);    -webkit-filter:blur(0px);    -moz-filter:blur(0px);    -o-filter:blur(0px);    -ms-filter:blur(0px);  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>  <div class="apffilter">      <img src="http://www.etnforum.com/templates/thewei-zz3/images/etndiamond2015.png" /><br /><br />      happy april fool's day!  </div>

here working model