Make buttons to switch between 12 and 24 hour time that saves to localstorage

I have a clock in my website, and I would like to add a button or switch into settings that switches the time from 12 hour and 24 hour and vice versa.
My problem is that I have no idea where to connect the setClockStyle in the clock.js

const displayTime = document.querySelector(".display-time");

function showTime() {
  let time = new Date();

  displayTime.innerText = time.toLocaleTimeString("en-US", {
    hour12: true,
    hour: '2-digit',
    minute: '2-digit'
  });

  setTimeout(showTime, 1000);
}

showTime();

function updateDate() {
  let today = new Date();
  let dayName = today.getDay(),
    dayNum = today.getDate();
  const IDCollection = ["daynum"];
  const val = [dayNum];

  for (let i = 0; i < IDCollection.length; i++) {
    document.getElementById(IDCollection[i]).firstChild.nodeValue = val[i];
  }
}

updateDate();

And buttons

<div class="section-title">Clock Style</div>

<div class="buttons">
  <button class="button" onclick="setClockStyle('12')">12hr</button>
  <button class="button" onclick="setClockStyle('24')">24hr</button>
</div>