CODEWITHSUNDEEP
javascripthtmlcss
user3044521
user3044521

Reputation: 1

Displaying div onclick not working

I'm trying to display a slideshow like the one shown here:- (http://www.w3schools.com/w3css/w3css_slideshow.asp) at the top when someone clicks "About Us, but I can't even get the onclick portion to work.

So far, I have:-

document.querySelector("p").addEventListener("click", function(){
    document.querySelector("div").style.display = "block";
});
#here{
  display: none;
}
  
<div id="here">Slideshow</div>
<p>About Us</p>

But it's not working for some reason. Can someone tell me what's wrong with the click function? I tried giving each of them individual IDs and I'm not sure what else to try. Thanks in advance for any help you guys can provide.

Upvotes: 0

Views: 189

Answers (1)

Alexis
Alexis

Reputation: 5831

It should works, the position of your script is important make sure your script is defined after your DOM. Or you can add your script inside a DOMContentLoadedevent.

document.addEventListener("DOMContentLoaded", function(event) { 
  //script here
});


document.querySelector("p").addEventListener("click", function(){
    document.querySelector("div").style.display = "block";
});
#here{display: none;}
<div id="here">Slideshow</div>
<p>About Us</p>

Upvotes: 3

Related Questions