How to show Open/Closed based on time records with an html class

Question

I\'m trying to display Open or Closed based on a company\'s time for that specific date using Javascript. I\'m using a theme Listify on WordPress which customers can list th

Answer 1

I've modified your code a little, making use of date.js:

http://codepen.io/anon/pen/VaGdBK

var da = new Date();
document.getElementById("display").innerHTML = da.toDateString();




//gets the current time. 
//var d = new Date();
var x = document.getElementsByClassName("start")[0].innerText;
var z = document.getElementsByClassName("end")[0].innerText;
//var o = parseInt(x,10);
//var c = parseInt(z,10);

var startTime = Date.parseExact(x, "h:mm tt");
var endTime = Date.parseExact(z, "h:mm tt");

if (da.between(startTime, endTime)){
    $(".open").show();
    $(".closed").hide();
}
else {  
    $(".closed").show();
    $(".open").hide();
}

.open, .closed {
  display: none;
}

Monday 
8:30 am - 
5:30 pm



Shop is open
Shop is closed

I haven't looked into it sufficiently so I don't know how it works regarding the timezone. You might have to adjust what I've posted to account for that.

Also: added a CSS rule to avoid the brief flash of both open and closed being displayed before one of them is hidden by jQuery.