JSFiddle - React, Tailwind, and code Playground

by Conor

HTML

<script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/utc.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/advancedFormat.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/timezone.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/customParseFormat.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js"></script>
<body>
<section>
<p>
Your guessed timezone is: <span id="timezone"></span>
</p>

<p>
Your episode time is: <span id="clock"></span>
</p>

<p>
Your episode Firefox time is: <span id="firefox"></span>
</p>

</section>
</body>

JavaScript

const event = new Date();
const current = event.toLocaleString();
const t = document.getElementById('timezone');
const d = document.getElementById('clock');
const f = document.getElementById('firefox');
dayjs.extend(window.dayjs_plugin_utc)
dayjs.extend(window.dayjs_plugin_timezone)
dayjs.extend(window.dayjs_plugin_advancedFormat)
dayjs.extend(window.dayjs_plugin_customParseFormat)

const guess = dayjs.tz.guess();
const episode = "2023-10-31T09:00:00-07:00";
const firefox = dayjs(episode).format('dddd, MMMM D @ h:mm A z');
const simple = dayjs(episode).format();

t.innerText = guess;
d.innerText = simple;
f.innerText = firefox;