JS - use cookie to store state on Google Ad Manager, hide element when close button is clicked

Question

// To maintain the state of the 'ads-side-slide' element when the page is refreshed, you can use cookies to store the last state of the element that was clicked by the user. Here is the modified code that achieves this functionality:

<div class="ads-side-slide">
    <div class="ads-toggle"><img src="https://test.com/dfp/mrec_sideslide/staging/88x100-skyworld.jpg" /></div>
    <div class="ads-toggle-close">close x</div>
    <div class="box">
        <a href="%%CLICK_URL_UNESC%%https://test.com/pullout/preview.pdf" target="_blank">
            <img src="https://test.com/example/ads/300x250-mrec.jpg" />
        </a>
    </div>
  </div>
  
  <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  <script>
  $(document).ready(function () {
    var mrecCookie = getCookie('mrec_sideslide_cookie');
    if (mrecCookie === 'closed') {
      $('.ads-side-slide').removeClass('in').addClass('out');
    } else {
      $('.ads-side-slide').removeClass('out').addClass('in');
    }
  });
  
  $('.ads-toggle').click(function () {
    if ($('.ads-side-slide').hasClass('in')) {
        $('.ads-side-slide').removeClass('in').addClass('out');
        document.cookie = 'mrec_sideslide_cookie=closed; expires=' + new Date(Date.now() + 3 * 60 * 60 * 1000).toUTCString() + '; path=/';
    }
    else {
        $('.ads-side-slide').removeClass('out').addClass('in');
        document.cookie = 'mrec_sideslide_cookie=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
    }  
  });
  
  $('.ads-toggle-close').click(function () {
    $('.ads-side-slide').removeClass('in').addClass('out');
    document.cookie = 'mrec_sideslide_cookie=closed; expires=' + new Date(Date.now() + 3 * 60 * 60 * 1000).toUTCString() + '; path=/';
  });
  
  function getCookie(name) {
    var cookieArr = document.cookie.split(';');
    for (var i = 0; i < cookieArr.length; i++) {
      var cookiePair = cookieArr[i].split('=');
      if (name === cookiePair[0].trim()) {
        return decodeURIComponent(cookiePair[1]);
      }
    }
    return null;
  }
  </script>  

we first check the value of the 'mrec_sideslide_cookie' cookie when the page is loaded. If it has the value 'closed', we set the class of the 'ads-side-slide' element to 'out', which indicates that the element should be hidden. If the cookie has any other value or is not present, we set the class of the 'ads-side-slide' element to 'in', which indicates that the element should be visible.

When the user clicks on the 'ads-toggle' element, we first check if the 'ads-side-slide' element has the 'in' class. If it does, we remove the 'in' class and add the 'out' class to hide the element. We also set the 'mrec_sideslide_cookie' cookie to 'closed' with an expiration time of 3 hours. If the 'ads-side-slide' element has the 'out' class, we remove the 'out' class