The document.getElementById will fail here because it will not be able to find the <span id="time"> because the <span> is loaded after the script has already run.
So you will need to check whether or not the element is present first and then append the time.
On Store Custom HTML block place this:
Order cut-off in <span class="customTime"></span>
On index.html place this:
<script>
(function () {
var start = new Date();
start.setHours(11, 0, 0); // 11am
function pad(num) {
return ("0" + parseInt(num)).substr(-2);
}
function tick() {
var now = new Date();
if (now > start) {
// too late, go to tomorrow
start.setDate(start.getDate() + 1);
}
var remain = (start - now) / 1000;
var hh = pad((remain / 60 / 60) % 60);
var mm = pad((remain / 60) % 60);
var ss = pad(remain % 60);
var elem = document.getElementsByClassName("customTime");
if (elem.length > 0) {
document.getElementsByClassName("customTime")[0].innerHTML =
hh + "h " + mm + "m " + ss + "s ";
}
setTimeout(tick, 1000);
}
document.addEventListener("DOMContentLoaded", tick);
})();
</script>
P.S, I have not tested this.
