CODEWITHSUNDEEP
javascripthtml
Harry Bains
Harry Bains

Reputation: 21

Setting button to change image Javascript

It should be straight forward but I can not get a function to change the image on button click. Please can anyone spot what is wrong with the below code. Thanks in advance.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>BlankCordovaApp4</title>

<!-- BlankCordovaApp4 references -->
<link href="css/index.css" rel="stylesheet" />
</head>
<body>
<p>Greeting!</p>

<img id="demo" src="images/hello.jpg" width="180" height="123">

<button id="Btn" type="button" onclick="changeImage();">Click Me</button>

<!-- Cordova reference, this is added to your app when it's built. -->
<script src="cordova.js"></script>

<script src="scripts/platformOverrides.js"></script>

<script src="scripts/index.js"></script>


<script>

function changeImage() {

document.getelementbyid("demo").src = "images/bye.jpg";
};

</script>

</body>
</html>

Upvotes: 2

Views: 65

Answers (1)

dfsq
dfsq

Reputation: 193261

It should be:

document.getElementById("demo").src = "images/bye.jpg";

Case matters in javascript: getelementbyid is not the same as getElementById.

Upvotes: 3

Related Questions