First you are not calling hidden function. If you want to call it then remove classList.add
var p1 = document.getElementById("p1")
var h2 = document.querySelectorAll("h2")[0];
function hidden(elem) {
elem.style.display = "none";
}
h2.addEventListener("click", function() {
hidden(p1)
})
h2 {
cursor: pointer;
}
<h2> I am h2</h2>
<div id="p1"> I am p1</div>
solved div.style.display not working when declared inside a function