JSFiddle - React, Tailwind, and code Playground
HTML
<button id="showmenu" type="button">Hide menu</button>
<div class="sidebarmenu">
This should go left
</div>
CSS
.sidebarmenu{
position:absolute;
left:0px
}
JavaScript
$(document).ready(function() {
$('#showmenu').click(function() {
var hidden = $('.sidebarmenu').data('hidden');
$('#showmenu').text(hidden ? 'Hide Menu' : 'Show Menu');
if(hidden){
$('.sidebarmenu').animate({
left: '0px'
},500)
} else {
$('.sidebarmenu').animate({
left: '-200px'
},500)
}
$('.sidebarmenu,.image').data("hidden", !hidden);
});
});