Dynamically add facebook like button using jquery

Question

How can i dynamically add facebook like button using jquery? I'm planning to have a gallery and want to add add like buttons under every image? I've tried this but it doesn't render anything: $('.share_button').append("(fb:like layout='button_count' font='tahoma')(/fb:like)") where share_button is a classname of div tag that will contain the like button.

Thanks in advance, Ivan

Monometallic

Answer 1

First of all, it should be:

$('.share_button').append("<fb:like layout='button_count' font='tahoma'></fb:like>")

Then, you should add this line:

FB.XFBML.parse($('.share_button').get(0));

However, I suggest you to use ID instead of class, or the codes above will parse all nodes containing class .share_button.

Shylashylock

answer is good, but to avoid memory leaks, add $('.share_button').empty() before appending or updating its innerHTML if you don't need the like button(s) anymore. my experience in some browsers. – Cruller

Answer 2

You also should have

xmlns:fb="http://www.facebook.com/2008/fbml"

and after you should parse FB tags that you add after page was loaded. It was previously answered here on SO

Acorn