CODEWITHSUNDEEP
javascripthtmlattributes
Boe6Eod7Nty
Boe6Eod7Nty

Reputation: 3

Javascript not changing <img> src attribute?

I've been looking through StackOverflow for an hour now and I;m still not sure what I'm missing here. I'm pretty new to JavaScript so it's probably something obvious, but I can't seem to find any answers online.

This is my HTML:

<body id="body" onclick="pageClick()">
    <img class="overlay" id="overlay1" src="images/empty.png">
</body>

and this is my JavaScript:

function pageClick() {
    document.getElementById("body").style.backgroundColor = "blue";
    document.getElementsById("overlay1").src = "images/banned.png";
}

I included the body background color to show myself that the script is running, yet the source attribute is not changing. Any help is appreciated!

Upvotes: 0

Views: 162

Answers (3)

samuel silva
samuel silva

Reputation: 432

you could use querySelector too

function pageClick() {
    document.querySelector("#body").style.backgroundColor = "blue";
    document.querySelector(".overlay1").src = "images/banned.png";
}

Upvotes: 0

TARiK
TARiK

Reputation: 16

Use document.getElementById instead document.getElementsById

Upvotes: 0

eag845
eag845

Reputation: 1013

It's getElementById, you wrote getElementsById.

Upvotes: 1

Related Questions