Menu close reads target as Undefined

Question

I am mounting a simple menu that ends when clicking on "Document", however, it appears that the target property cannot be read to Undefined

"Uncaught TypeError: Cannot read property 'target' of undefined"


//Vars
var userMenu = document.querySelector(".menu-holder");
var navButton = document.querySelector("#menu-nav-button");
var doc = document.documentElement;
//Functions
function toggleMenu(event){

    if(navButton.classList.contains("active")){
        navButton.classList.remove("active");
        userMenu.classList.remove("active");
        doc.classList.remove("active");
    }else{
        navButton.classList.add("active");
        userMenu.classList.add("active");
        doc.classList.add("active");
    }
}
function closeMenu(event){
    if(event.target == document.documentElement){
        navButton.classList.remove("active");
        userMenu.classList.remove("active");
        doc.classList.remove("active");
        console.log("oloco")
    }else{
        console.log("deu ruim")
    }
}closeMenu();

How can I correct the mistake, and why it happens ?

Answer 1

Its function called closeMenuwas to receive some parameter : function closeMenu(event){. This (Event) is the parameter.

And you call the function without passing any value to it : }closeMenu();

Try passing some value to this function.

Answer 2

I checked the Script above, the same if solved just by removing the statement CloseMenu() at the end of the creation of the