4

My code :

<a id="render-me" href="javascript:void(0);">Render me</a>
<div id="social-facebook"></div>​

$('#render-me').click(function (e){
    e.preventDefault();

    $('#social-facebook').html("<fb:like id='button-facebook' href='http://www.google.com' send='false' layout='button_count' width='450' show_faces='false'></fb:like>");
    FB.XFBML.parse(document.getElementById('button-facebook'));    
});

I click, but the button is not rendered. Where am I wrong?

markzzz
  • 47,390
  • 120
  • 299
  • 507

2 Answers2

10

You have to specify a node already in DOM. So, you can't use:

FB.XFBML.parse(document.getElementById('button-facebook'));

use instead:

FB.XFBML.parse(document.getElementById('social-facebook'));

and it will work fine ;)

Marco Palermo
  • 162
  • 8
  • Something changed since 2012 - and when doing this just now I had to parse the parent element - something like this `FB.XFBML.parse(document.getElementById('social-facebook')?.parentElement);` – Simon_Weaver Mar 29 '23 at 00:33
  • Another tip is to enable (temporarily!) the debug version of the SDK and look in the console for messages. https://developers.facebook.com/docs/javascript/advanced-setup/ – Simon_Weaver Mar 29 '23 at 00:37
5

Try to add this markup

<div id="fb-root"></div>

in bottom of page and make sure you are added FB script. Please have a look the image

enter image description here

Please follow these steps you will able to solve you problem.

For more info please go through this link https://developers.facebook.com/docs/reference/plugins/like/

Soarabh
  • 2,910
  • 9
  • 39
  • 57
  • Nothing change man! In fact I add the plugins after the "load/ready", so also if I put fb-root at the bottom nothing change! Tried with that code..nothing : in a click handler it doesnt render... – markzzz Oct 11 '12 at 14:11
  • 1
    That's funny : if I wrote only `FB.XFBML.parse();` it works :O – markzzz Oct 11 '12 at 14:22
  • 1
    "*That's funny : if I wrote only FB.XFBML.parse(); it works :O*" -- this is because you are re-parsing the ENTIRE page (every plugin). Not just the section you are aiming for. – IncredibleHat Mar 11 '18 at 15:42