JSFiddle - React, Tailwind, and code Playground

by Joe Cisneros

HTML

<div id="fb-root"></div>
<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button" data-action="like" data-show-faces="true" data-share="true">
    <img src="http://www.adweek.com/socialtimes/wp-content/uploads/sites/2/2012/09/facebook_like_button_big.jpeg" />
</div>

JavaScript

$(function () {

    //hover event for button
    $(".fb-like").hover(function () {

        //remove picture
        $("img", this).remove()

        //load FB scripts
        (function (d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s);
            js.id = id;
            js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=171501779696780&version=v2.3";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));

    })
});