JSFiddle - React, Tailwind, and code Playground

HTML

<section>       
 <h1> Images</h1>
 <h3> Photos </h3>
 <div id="gal">
 </div>
 <img id="img" src="http://s21.postimg.org/giip1wtf7/482fa5df3fc1b439d2bf872e7b98bac8036c6266.jpg" width="100px" height="100px"/>
 <img id="img" src="http://s21.postimg.org/l9no4l52v/forbidden.jpg" width="100px" height="100px"/>

    </section>

CSS

#gal {
    
  height:200px;
    width:400px;
    border:1px solid black;
    margin-bottom:20px;
}

JavaScript

$(document).ready(function(){
       var gal = $("#gal"); //Avoid repeated traverse

       $("img").hover(function(){
         gal.css("background",'url(' + $(this).attr('src') + ')');  
           console.log(gal.css("background"));
         //Assuming you want to set current image as background image
        });

       $( "img" ).mouseout(function(){
          gal.css("background","none");  
       });
    });