JSFiddle - React, Tailwind, and code Playground

HTML

<p><span>loading...</span></p>

<a href="#" id="btn">STOP</a>

CSS

p {
    margin-bottom: 50px;
    color: #555;
    font-size: 160%;
    font-weight: bold;
}

JavaScript

var _timer;
var _timerArr = [];
var fading;

var loaderBlink = function() {
    if(fading){
        $('p').find('span').fadeTo(200,.4).fadeTo(200,1,function() {
            interval_id = setTimeout(function() { loaderBlink() }, 200);
           // _timerArr.push(_timer);
            console.log('loading...');
        });
    }
};

var clearTimer = function() {
    /*
    $.each(_timerArr, function(i,val) {
        
        console.log(val);
    });
    */    
    clearTimeout(interval_id);
    fading = false;
    
   // $('#btn').remove();
   // $('p').fadeOut('fast');
    
    return false;
};

$('#btn').on('click', function() {
    clearTimer();
});

fading = true;
loaderBlink();