This.src.replace Img Src For Multiple Images

I want to change the source of an image when hovering over it. I've managed to do it for one image, by

Solution 1:

Since you're passing a reference to the image as a parameter, you don't need to use document.getElementById... you already have it!

function colorImage(x){
  x.src = x.src.replace("grey", "color");
}

You can continue to call the function using your first way:

<img id="image1" src="image1-grey.png" onmouseover=colorImage(this) />

Solution 2:

Looks like your problem is with image1 in the line below

onmouseover=colorImage(image1)

it needs to be in quotes like you are passing a string (shown below)

onmouseover=colorImage('image1')

The way your passing it now you are sending a javascript variable named image1 (which would be undefined) instead of the string name you want "image1"