greasemonkey - How to change a website image with javascript?

Question

I'm working with my first Greasemonkey script.

And its for a website that have a logo, i want to change the image to a image i have created, and i wonder how i do this?

like use JavaScript to edit the current html document and replace the image.

Thanks for any help!

Edit: The image is inside a <img> tag, the image i want to change/replace is in this code:

<img class="fb_logo img" src="https://s-static.ak.facebook.com/rsrc.php/v1/yp/r/kk8dc2UJYJ4.png" alt="Facebook logo" width="170" height="36">

Here is the javascript code i tryed and didnt work:

var myImage = document.querySelector('.fb_logo img');
myImage.src = "http://happylifeinnyc.com/wp-content/uploads/2011/07/facebook_love_heart.png";

Answer 1

var logos = document.getElementsByClassName("fb_logo");

for( var i = 0; i < logos.length; i++ )
{
    // true for all img tags with the fb_logo class name
    if( logos[ i ].tagName == "IMG" )
    {
        logos[ i ].src = "http://www.computerweekly.com/blogs/it-downtime-blog/lolcat-tan.jpg"
    }
}