Using JQuery to show/hide div based on month and date range

Question

I'm new to learning JQuery and I am trying to write a script that will only display text inside a div after May 1 and before June 1. This needs to ignore the year and only show the dive between these limits. Here is what I've been experimenting with:

 <script type="text/javascript">
    var today = new Date();
    //month begins with 0

     if ((today.getMonth() > 04 && today.getDate() > 01) || (today.getMonth() < 05 && today.getDate() < 01)){
        $('#cellOne').show(); 
      }
       else {
      $('#cellOne').hide();
    }
    </script>

Since today is not between these limits, I believe the div should be hidden, but I can't get it to work. Can anyone put me on the right path here? It is possible I have a logic error as I'm not very experience with JavaScript and JQuery. Much obliged.

For this particular situation, calculating the day of the year is not an ideal solution, mostly because when I hand the website back over to daily administrators they will not understand how to update the code.

Looks tricky... Try to calculate between the day of the year... — Praveen Kumar Purushothaman, Jun 18 '18 at 14:47
For anyone who still didn't find the answer: [JSFiddle](https://jsfiddle.net/zksfw1y6/) — Alex, Jun 18 '18 at 15:02
@Alex Thank you. Praveen Kumar's date of the year solution worked but was not feasible for the longterm. Your solution works much better for my employer's needs. — beingbecoming, Jun 18 '18 at 15:07
I have found a solution and would be willing to share the answer if @Praveen would unlock the post. — beingbecoming, Jun 18 '18 at 15:28

score 0 · Answer 1 · answered Jun 18 '18 at 15:50

Here is the answer I came up with, following the lead of @Alex

It seems to work and thought it might be useful to someone else.

$(document).ready(() => {
    // MM - DD - YYYY
  function getDayFromDate(dateString) {
    var now = new Date(dateString);
    var start = new Date(now.getFullYear(), 0, 0);
    var diff = now - start;
    var oneDay = 1000 * 60 * 60 * 24;
    return Math.floor(diff / oneDay);
  }

  let cutoffLow = getDayFromDate("05/01");
  let cutoffHigh = getDayFromDate("06/01");
  let now = getDayFromDate(new Date());

  if(now > cutoffLow && now < cutoffHigh) {
    document.querySelector('#cellOne').style.display = "";
  }
  else{
         document.querySelector('#cellOne').style.display = "none";
}
});

Using JQuery to show/hide div based on month and date range

1 Answers1