我做了一個下拉菜單，display: none;當它被點擊時，下拉部分有JS給它的類motherHover，display: grid;讓它可見。但問題是菜單出現了One-shot。純JS如何讓下拉菜單流暢顯示？function fgf(){    var hoverElement = document.querySelector(".father"),    tragtedElement = document.querySelector("#dds");    tragtedElement.classList.toggle("motherHover");}ul{    list-style: none;}.father{}.mother{    display: none;}.asd {    display: grid;}.motherHover{    display: grid;}<link href="https://meyerweb.com/eric/tools/css/reset/reset200802.css" rel="stylesheet"/>    <ul>        <li class="father" onclick="fgf()">            <button>                Drop Menu            </button>        </li>        <li id="dds" class="mother" >            <ul class="asd">                <i>g</i>                <i>g</i>                <i>g</i>                <i>g</i>                <i>g</i>            </ul>        </li>    </ul>