Verwijder div permanent met cookie

nuet

Soms kan het wle eens handig zijn als je je bezoekers van je website een eenmalige melding wilt geven over iets of dergelijks. Als ze die melding dan hebben gelezen , kunnen ze die wegklikken.
Stel we hebben die melding staan in een normale div ( dus geen popup), dan zullen we ervoor moeten zorgen dat die div permanent verborgen blijft en niet met een refresh terugkomt.
Onderstaand voorbeeldje plaatst hiervoor een cookie op het moment dat je de div wegklikt (bijvoorbeeld kik op kruis rechts bovenaan).

De div:

<div class="cookiediv">
     <a href="#" class="close-cookiediv"><div id="cross"></div></a>
        Hier de content van de div
</div>

Het divje wat tussen de anchor tags staat is er alleen om een kruisje te maken met css only. Er had ook gewoon een X kunnen staan.

Het cookiescript:

  <script>
    /* het cookiescript */
    jQuery(document).ready(function($) {
 function VerwijderCookieDiv(){
  days=30;
  myDate = new Date();
  myDate.setTime(myDate.getTime()+(days*24*60*60*1000)); // expiratietijd cookie
  document.cookie = 'VerwijderCookieDiv=Verwijder; expires=' + myDate.toGMTString();
 }
 var cookie = document.cookie.split(';')
 .map(function(x){ return x.trim().split('='); })
 .filter(function(x){ return x[0]==='VerwijderCookieDiv'; })
 .pop();
 if(cookie && cookie[1]==='Verwijder') {
  $(".cookiediv").hide();
 }
 $(document).on('click', '.close-cookiediv', function(){
  VerwijderCookieDiv();
  $(this).parent().remove();
  return false;
 });
});
</script>

De css voor de div en het css only kruis:

.cookiediv {
        margin: 0 auto;
        width: 400px;
        height: auto;
        border: 1px solid #ccc;
        padding: 10px;
    }
        
    #cross {
        float: right;
        top: -10px;
        right: -5px;
        background: red;
        height: 15px;
        position: relative;
        width: 3px;
        
        /* roteer het kruis*/
        -ms-transform: rotate(135deg); /* IE 9 */
        -webkit-transform: rotate(135deg); /* Chrome, Safari, Opera */
        transform: rotate(135deg);
        cursor: pointer;
        }
        
    #cross:after {
        background: red;
        content: "";
        height: 3px;
        left: -6px;
        position: absolute;
        top: 6px;
        width: 15px;
        }

Geebruikte API: https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js

DEMO

Feedback welkom!