JSFiddle - React, Tailwind, and code Playground

HTML

<div id="sidebar1" class="hide">
  Welcome preferred member!
  <img src="https://unsplash.it/600/200.png">
</div>
<div id="sidebar2" class="hide">
  Welcome, please consider signing up!
  <img src="https://unsplash.it/600/210.png">
</div>

<button id="setMemberButton">
  Add Cookie
</button>
<button id="deleteMemberButton">
  Delete Cookie
</button>

CSS

.hide {
  display: none;
}

JavaScript

if (readCookie('preferredMember') === 'true') {
  $('#sidebar1').show();
} else {
  $('#sidebar2').show();
}

$('#setMemberButton').on('click', function() {
  createCookie('preferredMember', 'true');
});

$('#deleteMemberButton').on('click', function() {
  eraseCookie('preferredMember');
});

function createCookie(name, value, days) {
  var expires = "";
  if (days) {
    var date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    expires = "; expires=" + date.toUTCString();
  }
  document.cookie = name + "=" + value + expires + "; path=/";
}

function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') c = c.substring(1, c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
  }
  return null;
}

function eraseCookie(name) {
  createCookie(name, "", -1);
}