JSFiddle - React, Tailwind, and code Playground
HTML
<input type="submit" value="Blink Click Me" id="btn"/>
CSS
.highlight
{
border: 3px solid #FBB72D;
font-weight: bold;
border-radius: 5px;
}
.highlighted
{
border: 3px solid #000000;
font-weight: bold;
border-radius: 5px;
}
JavaScript
function blink(btn) {
blink1(btn);
}
function blink1(btn1) {
//document.getElementById(btn1).className = ;
btn1.removeClass();
btn1.addClass("highlight");
setTimeout(function () { blink2(btn1); }, 4000);
}
function blink2(btn2) {
//document.getElementById(btn2).className = "highlighted";
btn2.removeClass();
btn2.addClass("highlighted");
setTimeout(function () { blink1(btn2); }, 750);
}
blink($('#btn'));