jQuery .click() not working on image

I have been making a simple hamburger menu with jQuery and it refuses to detect a click on my image (id hamburgericon). If I paste the code, the console.log does not even print out “you clicked” when I click. If I select any other id or class selector, it also fails. However, if i replace "#hamburgericon" with document, the code runs perfectly. What am I doing wrong?

$("#hamburgericon").click(function () {
  console.log("You Clicked!");
  if ($("#mobile-menu").is(":visible")){
    console.log("Hi!");
    $("#mobile-menu").hide();
    $("#hamburgericon").attr("src", "hamburger.png");
  }else{
    console.log("h1");
    $("#mobile-menu").show();
    $("#hamburgericon").attr("src", "hamburger-close.png");
  }
});

Could you post the HTML code, too?
From what I can guess, it might be that there is a tippo or some other problem which prevents $("#hamburgericon") to find the element.

Here is the beginning of the <body> code ( I changed the icon to a div to see if it would help, but it did not):

<body>
  <div id="mobile-menu">
    <a href="cte.html">Career and Technical Education</a>
    <a href="tsa_chapter.html">TSA Chapter</a>
  </div>
  <div id="hamburgericon"></div>
...
  • I wonder if the <div id="hamburgericon"></div> actually takes up any space you can click into. To test you could write `
    Text takes up space
  • You could have run in the age-old javascript problem of your code not being ready yet. Did you include the code directly before </body> or inside a $(function(){… ?

For anything beyond this, you probably need to either link to the page you create or replicate the problem in a jsfiddle