JQuery to display content based on date and time

by ian_smithz

HTML

<!-- date format should be exactly like this example -->
<!-- e.g. -->
<!-- Nov 09 2018 09:00 to Nov 09 2018 09:01 -->

<div class="timed-content">
    <time style="display: none" aria-hidden="true">Nov 14 2018 07:24 to Nov 14 2018 07:25</time>
    
    <img class="timed-banner" src="http://placehold.it/744x125/ddd/333&text=Block+1+demo+banner">
    
</div>

<div class="timed-content">
    <time style="display: none" aria-hidden="true">Nov 14 2018 07:24 to Nov 14 2018 07:25</time>
    
    <img class="timed-banner" src="http://placehold.it/744x125/ddd/333&text=Block+2+demo+banner">
    
</div>

<div class="timed-content">
    <time style="display: none" aria-hidden="true">Nov 14 2018 07:25 to Nov 14 2018 07:26</time>
    
    <img class="timed-banner" src="http://placehold.it/744x125/ddd/333&text=Block+3+demo+banner">
    
</div>

<div class="timed-content">
    <time style="display: none" aria-hidden="true">Nov 14 2018 07:25 to Nov 14 2018 07:26</time>
    
    <img class="timed-banner" src="http://placehold.it/744x125/ddd/333&text=Block+4+demo+banner">
    
</div>

CSS

.timed-content {
    display: none;
}

JavaScript

jQuery(function () {
    jQuery(".timed-content").each(function (index) {
        var sRange = jQuery(this).find("time").html();
        var arrTemp = sRange.split(" to ");
        var dtFrom = new Date(arrTemp[0]);
        var dtTo = new Date(arrTemp[1]);
        var dtNow = new Date();
        if (dtNow >= dtFrom && dtNow <= dtTo){jQuery(this).show();}
    });
});