JSFiddle - React, Tailwind, and code Playground

HTML

<div class="facebook">
    <a href="#">
        <img src="https://dmcohen01.files.wordpress.com/2012/03/5b2145c4aakermit.jpg"/>
    </a>
</div>

JavaScript

$('img').mouseenter(function() {
    var self = $(this);
    self.fadeOut('slow', function(){
        self.attr('src', 'http://images4.wikia.nocookie.net/__cb20100831164753/muppet/images/7/70/Firstmatepiggy.jpg').fadeIn('slow');
    });
});
$('img').mouseleave(function(){
    var self = $(this);
    self.fadeOut('slow', function(){
         self.attr('src', 'https://dmcohen01.files.wordpress.com/2012/03/5b2145c4aakermit.jpg').fadeIn('slow');
    });
    
});