How do you swap webflow's main css to other Github hosted css based on user's machine local time?

I'm trying to use the following script to apply the css to a website depending on user local time:

<script>
function getStylesheet() {
      var currentTime = new Date().getHours();
      if (0 <= currentTime&&currentTime < 5) {
       document.write("<link rel='stylesheet' href='https://rawcdn.githack.com/Jacopospina/humansplusmachines/6647fd1cb01b9b756e11d50f88efd72a6e800694/night.css' type='text/css'>");
      }
      if (5 <= currentTime&&currentTime < 16) {
       document.write("<link rel='stylesheet' href='portfolio-c16909.webflow.a39b8eeda.css' type='text/css'>");
      }
      if (16 <= currentTime&&currentTime < 22) {
       document.write("<link rel='stylesheet' href='https://rawcdn.githack.com/Jacopospina/humansplusmachines/6647fd1cb01b9b756e11d50f88efd72a6e800694/afternoon.css' type='text/css'>");
      }
      if (22 <= currentTime&&currentTime <= 24) {
       document.write("<link rel='stylesheet' href='https://rawcdn.githack.com/Jacopospina/humansplusmachines/6647fd1cb01b9b756e11d50f88efd72a6e800694/night.css' type='text/css'>");
      }
}

getStylesheet();
</script>

<noscript><link href="portfolio-c16909.webflow.a39b8eeda.css" rel="stylesheet"></noscript>

Basically, what I'd like to do is to apply a CSS theme based on the user local machine time (e.g. day, afternoon and night type of themes).

Here are my raw css taken from my repo @ GitHub (i know afternoon.css is exactly the same as webflow's main css but that's fine since i'll modify it later. my main point first is to have the script work successfully first).

Thank you very much in advance for your thinking — very much appreciated!

from Recent Questions - Stack Overflow https://ift.tt/3CigE56
https://ift.tt/eA8V8J