JSFiddle - React, Tailwind, and code Playground

by AlpDmr

HTML

<input type="text "class="try" value="value"/><br/>
 <input type="button" class="fire" value="Fire Animation"/>

CSS

.try{
 border:1px solid #a6caf0;
 }

JavaScript

jQuery.fn.shake = function(intShakes, intDistance, intDuration,callback) {
        this.each(function() {
            $(this).css("position","relative");
            for (var x=1; x<=intShakes; x++) {
            $(this).animate({left:(intDistance*-1)}, (((intDuration/intShakes)/4)))
        .animate({left:intDistance}, ((intDuration/intShakes)/2))
        .animate({left:0}, (((intDuration/intShakes)/4)));
        }
      });
    if(callback) callback();
    return this;
    };
$('.fire').click(function(){
$elem = $('.try');
$elem.css('borderColor','red');
$elem.shake(5,10,500,function(){
$elem.css('borderColor','#a6caf0');
 });
});