JSFiddle - React, Tailwind, and code Playground
HTML
<!doctype html>
<html>
<head><title>jQuery example</title></head>
<body>
<a href="#" id="button">Click me</a>
<div class="target">I will bounce</div>
<div class="target">I will bounce too, since I have the same class name</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
// Notice the .on instead of .click, it's the new style for events
// in jQuery and the e argument
$("#button").on('click', function (e) {
e.preventDefault();
$(".target").effect( "bounce", { times : 10}, 3000);
});
});
</script>
</body>
</html>