JSFiddle - React, Tailwind, and code Playground

by Sunny SM

HTML

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<p id="b2">
This is dummy text for performing efects 
</p>
<b/>
<p id="b3">
This is dummy text for performing efects 
</p>
<b/>
<p id="b4">
This is dummy text for performing efects 
</p>
<b/>
<p id="b5">
This is dummy text for performing efects 
</p>
<b/>
<p id="b6">
This is dummy text for performing efects 
</p>

JavaScript

$(document).ready(function() {
   $('#b2, #b3, #b4, #b5, #b6').hover(function(){
    $(this).effect("bounce", {times: 1}, "slow");
  });
  /*setInterval(function() {
    $("#b2").delay(2000).effect("bounce", { times: 1 }, "slow");
    $("#b4").delay(4000).effect("bounce", { times: 1 }, "slow");
    $("#b6").delay(6000).effect("bounce", { times: 1 }, "slow");
    $("#b3").delay(8000).effect("bounce", { times: 1 }, "slow");
    $("#b5").delay(10000).effect("bounce", { times: 1 }, "slow");
  }, 1000);   */
  });