JSFiddle - React, Tailwind, and code Playground
HTML
<span class="another-class">This text will change after 1 second</span><br>
<span class="some-class">This text will change after 2.5 seconds</span>
JavaScript
//Create new jQuery function "someFunction"
$.fn.someFunction = function(options) {
//Set defaults
var settings = $.extend({
color: "red",
time: 1000
}, options); //Use options when supplied
return this.each(function() {
$(this).delay(settings.time).queue(function (next) {
$(this).css("color", settings.color);
next();
});
});
};
$(document).ready(function() {
$('.some-class').someFunction({
time: 2500,
color: 'blue'
});
$('.another-class').someFunction();
});