Change image src on click javascript

Question

So, I have an upvote image, when that upvote image is clicked, it should change to downvote image. So, in my img/ folder in my directory, I have these two upvote and downvote images. So, basically, when the upvote image is clicked, it should change to downvote image, by changing source (src), which I tried to achieve using Javascript.

Here's my code:

 function changetextUpvote() { var textUpvoteImg = document.getElementById(textUpvoteImg); if (textUpvoteImg.src.match("downvote")) { textUpvoteImg.src = "img/upvote.png"; } else { textUpvoteImg.src = "img/downvote.png"; } }

 <img class="textupvote" id="textUpvoteImg" src="img/upvote.png" alt="upvote" onclick="changetextUpvote()" style="width: 100px; margin-bottom: 28px; cursor: pointer">

However, when I click the upvote image, it is not changing to the downvote image. Any clue on why this is occurring? Thanks a lot for the help!

Answer 1

You have written var textUpvoteImg = document.getElementById(textUpvoteImg);

getElementById takes in a string as an argument

So, all you need to do is add quotation marks to the argument you are passing:

var textUpvoteImg = document.getElementById("textUpvoteImg");