JSFiddle - React, Tailwind, and code Playground

by lsubirana

HTML

<div id="timer"></div>

JavaScript

(function ($) {
    
     
    $.fn.timeCounter = function(time) {
        
        return this.each(function () {
             var obj = $(this).data("timeCounter") || {},
                 target = new Date(time),
                 me = $(this),
             
                 cdtd = function(){
                     var now = new Date();
                     var timeDiff = target.getTime() - now.getTime();
                     if (timeDiff <= 0) {
                         clearTimeout(timer);
                     }
                     var seconds = Math.floor(timeDiff / 1000);
                     var minutes = Math.floor(seconds / 60);
                     var hours = Math.floor(minutes / 60);
                     var days = Math.floor(hours / 24);
                     hours %= 24;
                     minutes %= 60;
                     seconds %= 60;
                     me.html('');
                     me.append( "<span>"+days+"</span> days " );
                     me.append( "<span>"+hours+"</span>:" );
                     me.append( "<span>"+minutes+"</span>:" );
                     me.append( "<span>"+seconds+"</span>" );
                     var timer = setTimeout(cdtd,1000);     
                 };
        });
        
    
    };
    
})(jQuery);

$("#timer").timeCounter("june 16, 2014 00:01:00");