BotB Timestamp From Countdown

BotB_battle_timestamper.user.js

// ==UserScript==
// @name         BotB Battle Timestamper
// @namespace    https://battleofthebits.com/barracks/Profile/Abraxas86/
// @version      2
// @description  Adds timestamp for event because trying to mental math times is too much for my stupid monke brain
// @author       abraxas86
// @match        https://battleofthebits.com/arena/Battle/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=battleofthebits.com
// @grant        none
// ==/UserScript==
/* eslint-disable no-multi-spaces */
/* eslint-disable no-multi-str */
/* globals $ */

(function() {
    'use strict';

    // Grab seconds to next battle from site source:
    var msToBattle = parseInt($('.countdown')[0].textContent)*1000;

    // Create a copy of the current date to be processed later
    var battleDate = new Date();

    // Calculate the future time by adding seconds to the copied date
    battleDate = new Date(battleDate.getTime() + msToBattle);

    var amPM; // AM or PM, duh
    var hour; // Converted 24 to 12h time


    // convert to 12 hour time
    if (battleDate.getHours() < 12)
    {
        if (battleDate.getHours == 0)
        {
            hour = 12;
            amPM = 'AM';
        }

        hour = battleDate.getHours();
        amPM = 'AM';
    }
    else
    {
        hour = battleDate.getHours() - 12;
        amPM = 'PM';
    }

    battleDate = `${battleDate.getFullYear()}-${('0' + (battleDate.getMonth() + 1)).slice(-2)}-${('0' + battleDate.getDate()).slice(-2)} ${('0' + hour).slice(-2)}:${('0' + battleDate.getMinutes()).slice(-2)} ${amPM}`;

    // Create HTML element to hold the proper time
    var dateElement = document.createElement("span");
    dateElement.textContent = battleDate;
    dateElement.setAttribute("class","t5");
    dateElement.setAttribute("id","buttTime");
    // This is the section housing the countdown:
    var countdownElement = document.querySelector('.t5');

    // Insert the dateElement after the countdown:
    $('.countdown').css({"display":"none", "cursor":"pointer"});
    $(dateElement).insertAfter('.t5 > b:nth-child(1)');
    $('#buttTime').css("cursor","pointer");

    $('#buttTime').on('click', function() {
        $(this).css('display','none');
        $('.countdown').css('display','inline-block');
    });

    $('.countdown').on('click', function() {
        $(this).css('display','none');
        $('#buttTime').css('display','inline-block');
    });

})();

Just changed the name. This is a WiP but I had to leave it at this until I get time to work on it later.

It currently just adds a proper timestamp to the box with the countdown.

Is it elegant? No
Is it coded as well as it could be? Probably not.
Does it work? It did when I tried it...

Gutted and re-coded. Much better now. Click the date to flip to the regular timer. Click the timer to flip back to the date.

I'll work on some of the other timers tomorrow