JSFiddle - React, Tailwind, and code Playground

HTML

<div id="initiate">Test</div>
<div id="nav">
    <p>testing</p>
</div>

CSS

#initiate {
    float: left;
}

#nav {
    padding: 0px;
    border: 0px solid #ccc;
    float: right;
    right: -320px;
    display: block;
    background-color: #000000 !important;
    box-shadow: -5px 0 5px rgba(174, 174, 174, 0.8);
    width: 320px;
    height: 100%;
    position: fixed;
}

JavaScript

$("#initiate").click(function(event) {
    if ($("#nav").hasClass("hidden")) {
        $("#nav").stop().animate({
            right: '-320px'
        }, 1300);

    } else {
        $("#nav").stop().animate({
            right: '520px'
        }, 1300);
    }
    $("#nav").toggleClass("hidden")
});