JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<button id="demo_icon">Click me</button>
<hr/>
<div class="demo_changer active">Lorem ipsum dolor sit amet...</div>

CSS

.demo_changer {
    padding: 20px;
    background-color: grey;
    text-align: left;
    left: 0;
    position: absolute;
    top: 100px;
    transition: all 0.3s ease;
}

.demo_changer.active {
    left: -180px;
}

JavaScript

function setMyCookie() {
    myCookieVal = $('.demo_changer').hasClass('active') ? 'isActive' : 'notActive';
    $.cookie('myCookieName', myCookieVal, { path: '/' });    
}

if ($.cookie('myCookieName') == 'isActive') {
    $('.demo_changer').addClass('active');    
} else {
    $('.demo_changer').removeClass('active');
}

$("#demo_icon").click(function () {
    $('.demo_changer').toggleClass('active');
    setMyCookie();
});