JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<article class="alert-box" id="alert-box-news">
  <h1>News Alerts</h1>
  <p>text text text text text text text text text text text text text text</p>
  <a class="alert-box-close" id="close-alert-box-news">
    <img src="https://i.imgur.com/czf8yas.png" height="25" width="25" alt="">
  </a>
</article>

<article class="alert-box" id="alert-box-maintenance">
  <h1>Site Maintenance</h1>
  <p>text text text text text text text text text text text text text text</p>
  <a class="alert-box-close" id="close-alert-box-maintenance">
    <img src="https://i.imgur.com/czf8yas.png" height="25" width="25" alt="">
  </a>
</article>

CSS

.alert-box {
  width: 50vw;
  position: relative;
  margin: 20px auto;
  border: 1px solid black;
}

.alert-box-close {
  position: absolute;
  top: -12px;
  right: -12px;
  cursor: pointer;
}
#alert-box-news,#alert-box-maintenance{
  display:none;
}

JavaScript

$(document).ready(function() {



    var nd = new Date(); // initial values for date variables
    var md = nd;
    var newsclicked = false;
    
    var maintenanceclicked = false;
    
    setInterval(function() {
    newsclicked = (localStorage.getItem("newsclicked")) ? new Date(localStorage.getItem("newsclicked")): false;
    maintenanceclicked = (localStorage.getItem("maintenanceclicked")) ? new Date(localStorage.getItem("maintenanceclicked")): false;
      if(maintenanceclicked===false) {
      console.log(maintenanceclicked);
        $("#alert-box-maintenance").show(800);    
        } else {
        var mddiff = (md.getTime()-maintenanceclicked.getTime())/(60*60*24*1000);
        if(mddiff>=1){
        $("#alert-box-maintenance").show(800);     
        } else {
        $("#alert-box-maintenance").hide(800); 
        }
        }

if(newsclicked===false) {
        $("#alert-box-news").show(800);    
        } else {
        var nddiff = (nd.getTime()-newsclicked.getTime())/(60*60*24*1000);
        if(nddiff>=1){
        $("#alert-box-news").show(800);     
        } else {
        $("#alert-box-news").hide(800); 
        }
        }
},200);
      $("#close-alert-box-news").on("click",function() {
        nd = new Date(); // get the current date and time that close-alert-box-news was clicked and store it to localStorage
        localStorage.setItem("newsclicked",nd);
        $("#alert-box-news").hide(800);       
      });
      $("#close-alert-box-maintenance").on("click",function() {   
        md = new Date(); // get the current date and time that close-alert-box-maintenance was clicked and store it to localStorage
        
        localStorage.setItem("maintenanceclicked",md);
        $("#alert-box-maintenance").hide(800);
      });
        

    });