JSFiddle - React, Tailwind, and code Playground

by Luke Marlow

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<span class="game-timer" id="game-timer" data-timestamp="1562616119">July 8, 2019 9:01:59 pm</span>

JavaScript

date_time = function(id) {
	let stamp  = $('#' + id).data('timestamp'); 
    let months = date_time_get_months();
    let days   = date_time_get_days();
    let date   = new Date(stamp * 1000);
    let year   = date.getFullYear();
    let month  = date.getMonth();

	$('#' + id).data('timestamp', stamp + 1)

	d   = date.getDate();
    day = date.getDay();
    h   = date.getHours();
    if (h < 10) {
        h = "0" + h;
    }

	m = date.getMinutes();
    if (m < 10) {
        m = "0" + m;
    }

	s = date.getSeconds();
    if (s < 10) {
        s = "0" + s;
    }

    a = h > 12 ? 'pm' : 'am';
    if (a === 'pm') {
    	h -= 12;
    }

    result = months[month] + ' ' + d + ', ' + days[day] + ' ' + year + ' ' + h + ':' + m + ':' + s + ' ' + a;
    $('#' + id).text(result);

    setTimeout(function() {
        date_time(id);
    }, 1000);
};

date_time_get_months = function() {
    return {
        0: 'January',
        1: 'February',
        2: 'March',
        3: 'April',
        4: 'May',
        5: 'June',
        6: 'July',
        7: 'August',
        8: 'September',
        9: 'October',
        10: 'November',
        11: 'December'
    };
};

date_time_get_days = function() {
    return {
        0: 'Sunday',
        1: 'Monday',
        2: 'Tuesday',
        3: 'Wednesday',
        4: 'Thursday',
        5: 'Friday',
        6: 'Saturday'
    };
};

date_time('game-timer');