JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<ul>
<li>
  <div class="member">
  <img src="http://dhaval.site/mota9/wp-content/uploads/2016/09/Jess-headshot.png">  
  </div>
</li>
</ul>

CSS

ul {
  list-style-type: none;
  padding: 0;
}
li {
  margin: 10px;
  display: inline-block;
}/*
.member {
  background: url('https://placeholdit.imgix.net/~text?txtsize=17&bg=0088cc&txtclr=ffffff&txt=default&w=180&h=180');   background-repeat: no-repeat; 
}
.member:hover {
  background: url('https://placeholdit.imgix.net/~text?txtsize=17&bg=17B890&txtclr=ffffff&txt=mouseover&w=180&h=180');  
}
.member:not:hover {
  background: url('https://placeholdit.imgix.net/~text?txtsize=17&bg=E08E45&txtclr=ffffff&txt=mouseout&w=180&h=180');  
}*/

JavaScript

/*
https://api.jquery.com/mouseenter/
*/
$( ".member" ).mouseenter(function() {
  $( "img" ).replaceWith( "<img src='http://dhaval.site/mota9/wp-content/uploads/2016/09/Jess-gif.gif'>" );
});
$( ".member" ).mouseleave(function() {
  $( "img" ).replaceWith( "<img src='http://dhaval.site/mota9/wp-content/uploads/2017/01/Gina.gif'>" );
});