JSFiddle - React, Tailwind, and code Playground

HTML

<div class="red">Here is my text.</div>

CSS

.red {
    text-shadow: 0px 0px 0px #c61a1a;
    font-size:50px;
    color:#c61a1a;
    cursor:pointer;
}

JavaScript

var red = $(".red");
red.click(function() {
   if ( !$(this).is(':animated') )

    //you just adjust here
    red.glowEffect(0,40,500);
    //which is:
    //red.glowEffect( start value , destination value , duration );
});

$.fn.glowEffect = function(start, end, duration) {
    var $this = this;
    return this.css("a", start).animate({
        a: end
    }, {
        duration: duration,
        step: function(now) {
            $this.css("text-shadow","0px 0px "+now+"px #c61a1a");
        }
    });
};