Render 'like' button after ajax call Render 'like' button after ajax call ajax ajax

Render 'like' button after ajax call


You have to call FB.XFBML.parse(); after the ajax call.

Documentation: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

Edit: now I see that you're trying to load content into $('#thequestion'). .load takes a callback that runs after the request completes. You should do something like:

$('#thequestion').load('/my/url', { my: 'params' }, function() {    FB.XFBML.parse();});

Documentation: http://api.jquery.com/load/


Not sure anyone needs it, but my complete code looks like this now and renders both FB page and Like button appropriatelly (LikeLink button created with material icon):

<i id="LikeLink" class="material-icons actionButton">&#xE8DC;</i>var fbloaded = false; // if SDK is loaded, no need to do it again (though cache should do this?var fbpageid = "myPageId"; // FB page id// ajax call to FB SDK scriptif (!fbloaded) {    $.ajax({        type: "GET",        url: "//connect.facebook.net/en_US/sdk.js",        dataType: "script",        cache: true,        success: function () {            fbloaded = true;            FB.init({                appId: '{myAppId}',                version: 'v2.3' // or v2.0, v2.1, v2.0            });// parse button after success            FB.XFBML.parse();        }    });}var FBDivAppended = false; // if already done, do not call and render againPostUrl = window.location.href; // like button needs this... or not :)// when LikeLink is clicked, add the divs needed and at the end fire the FB script ajax call (resetFB)$("#LikeLink").click(function () {if (!FBDivAppended) {            var $pagediv = $("<div class=\"fb-page\" data-href=\"https://www.facebook.com/" + fbpageid + "\" />");            var $fblikediv = $("<div class=\"fb-like\" data-href=\"" + PostUrl + "\" />");            var $fbdiv = $("<div id=\"fbDiv\" />");            var $fbroot = $("<div id=\"fb-root\" />");            $fbdiv.append($pagediv).append($fblikediv);            $(".Header").append($fbdiv).append($fbroot);            FBDivAppended = true;        }resetFB();}