Need to change an image back and fourth with javascript

I want an image to be changed between 2 images with the click of a button, however with my current code when I click the button, it only changes once, but will not change back. How can I fix this?

Here is my HTML code:

index.html

script.js

function changeImg() { if (document.getElementById("demo3").src = "cupcake.png") { document.getElementById("demo3").src = "coffee.png"; } else { document.getElementById("demo3").src = "cupcake.png"; } }

I want the page to initially display the cupcake image, then when the button is clicked, show the coffee image, then when the button is clicked again, show the cupcake image again.

Any help would be great!