JSFiddle - React, Tailwind, and code Playground

by pisamce

HTML

<div class="msgblink">something</div>
<div class="msgblink">nothing</div>
<div class="msgblink">something</div>
<div class="msgblink">another</div>
<input class="msgblink" type="text" value="something" />

CSS

.blink {
    color: #FFF !important;
    background: #FC79CE;
}

JavaScript

$(document).ready(function () {
    //blink(".msgblink", 4, 500);
    $(".msgblink").each(function () {
        if (($(this).val()||$(this).text()) === 'something') {
            blink(this, 4, 500);
        }
    });
});

function blink(elem, times, speed) {
    if (times > 0 || times < 0) {
        if ($(elem).hasClass("blink")) $(elem).removeClass("blink");
        else $(elem).addClass("blink");
    }

    clearTimeout(function () {
        blink(elem, times, speed);
    });

    if (times > 0 || times < 0) {
        setTimeout(function () {
            blink(elem, times, speed);
        }, speed);
        times -= .5;
    }
}