how to store a function so it works only after clicked and results stays after refreshing the page?-CodePudding

    function hd() {
        document.getElementById("Y").style.display = "none";
    }

body {
display:grid;
place-content: center;
height:100vh;
overflow:hidden;
}

<div id="Y">i will be hidden</div>
<br>
<button onclick="hd();">click me</button>

The important thing is to store the function so it works even user refreshes the page I tried to use cookies but it did not work by just calling the function

CodePudding user response：

You could set a flag with localStorage and then check whether this flag has been set already and call the function at startup again.

function hd () {
    document.getElementById("Y").style.display = "none";
    localStorage.setItem("hidden", "yes");
}

if (localStorage.getItem("hidden")) {
    hd();
}