Struggling with finding the correct function to open the hidden div of my responsive menu on my new website.
Check out my code: https://codepen.io/anon/pen/XRJRGE
<a class="page-head__menu" id="js-menu" href="#" onClick="open()">Menu</a>
<script> U = function(t) {
M.setAttribute("data-state", "visible" === M.getAttribute("data-state") ? "hidden" : "visible"), this.setAttribute("data-state", "open" === this.getAttribute("data-state") ? "closed" : "open"),
"open" === this.getAttribute("data-state") && O ? (A(k, "white"), A(C, "white")) : O && (E(k, "white"), E(C, "white")),
"open" === this.getAttribute("data-state") ? clearInterval($): "/" === e.location.pathname && s(), t.preventDefault()
} </script>
<div id="js-overlay" >
<ul class="menu-nav">
<li class="sel"> <a href="/portfolio">Portfolio</a>
<script>var Z = function(e) {
var t = this.getAttribute("href");
N.innerHTML = "", M && (M.setAttribute("data-state", "hidden"), D.setAttribute("data-state", "open")), w(t), a(t), e.preventDefault()
} </script>
</li>
<li class="sel"> <a href="/about">About & Contact</a>
</li>
</ul>
<div class="content"> </div>
<div class="menu-social">
<a href="https://facebook.com/bojanaknezevicart" class="page-social__facebook js-social-icon">Facebook</a>
<a href="http://instagram.com/" class="page-social__instagram js-social-icon">Instagram</a>
<a href="https://www.behance.net/" class="page-social__behance js-social-icon">Behance</a>
<a href="http://dribbble.com/" class="page-social__dribbble js-social-icon hide-header">Dribbble</a>
</div></div> </div>
The code is quite lengthy, hence the link provided at the start of the question. A more visual representation is needed, like this: enter image description here