一个移动端的菜单隐藏与宣示

Question

#apDiv1 {  z-index: 9999;    width: 1rem;    background-color: darkgoldenrod;;    font-size: .12rem;    display:none;    position: fixed;    top: .4rem;    right: .15rem;    border-radius: 5px;    margin-top: 5px;    color:#FFFFFF;}<button type="button" id="gold-menu-btn"  class="icon-menu"></button><div id="apDiv1">     <ul>        <li><a href="address.html">编辑地址</a></li>        <li><a href="record.html">兑换记录</a></li>        <li><a href="giftpack.html">兑换确认</a></li>    </ul>     </div>   window.onload=function(){       var btn = document.querySelector('#gold-menu-btn');var div = document.querySelector('#apDiv1');btn.addEventListener('click', function(ev) {  event.stopPropagation();  if (div.className.indexOf('hide') >= 0) return div.classList.remove('hide');  div.classList.add('hide');}, false);document.addEventListener('click', function(ev) {  div.classList.add('hide');}, false);       }当我点击btn按钮时；控制下面div的宣示与隐藏；当div宣示时点击页面其他部分能够把div隐藏；移动端的网页；请问这段代码怎么写