JSFiddle - React, Tailwind, and code Playground

HTML

I changed the image names, but nothing else:<br />

<img src="http://starrfmonline.com/kitnes/data/2014/12/18/1.1930559.jpg" id="toChange" />

<img src="http://blog.ecycler.com/wp-content/uploads/2011/08/vhs-tapes.jpg" class="image" data-src="http://ie.reachout.com/wp-content/uploads/2012/02/1078874_word_work_on_the_dices.jpg" />    <!-- data-attribute is used to store custom data, such as source -->
<img src="http://www.cliparthut.com/clip-arts/146/phone-book-clip-art-146550.jpg" class="image" data-src="http://www.marismith.com/wp-content/uploads/2009/12/team.jpg" />
<img src="http://www.mavcomp.com/wp-content/uploads/2009/06/office-phone.jpg" class="image" data-src="http://www.wordoflifeministries.org/wp-content/uploads/2011/03/contact.jpg" />

CSS

img {
    height: 75px;
    width: 75px;
}
img#toChange {
    height: 200px;
    width: 200px;
}

JavaScript

$(".image").each(function() {
    $(this).hover(function() {    // this is the mouseenter event handler
        $("#toChange").attr("src", $(this).attr("data-src"));
    }, function() {               // this is the mouseleave event handler
        $("#toChange").attr("src", "http://starrfmonline.com/kitnes/data/2014/12/18/1.1930559.jpg");    // this will revert it back to the original image (tv.jpg)
    });
});