Adding a Google +1 Button after page load in IE 8

Question

I'm working on a site right now where I need to build a URL before putting the button on the page. Here's how it works:

var googleplus = $("<g:plusone size='tall' href='http://google.com'></g:plusone>");
$("#container").append(googleplus);
gapi.plusone.go();

And in the head I have this:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

This works in Firefox/Chrome/IE 9, but not IE 8. I'm at a loss as to what else to do to make it work. I tried with the gapi.plusone.render() method as well, still no luck.

Answer 1

Here is the solution, it works for me in both IE7/8:

var gPlusOne = document.createElement('g:plusone');
gPlusOne.setAttribute("size", "tall");
gPlusOne.setAttribute("href", "http://google.com");
container.appendChild(gPlusOne);

it appears that using innerHTML to insert a <g:plusone></g:plusone> element into a page does not work in IE7/8, Create the g:plusone element directly like this: document.createElement('g:plusone'). see more: http://www.google.com/support/forum/p/Webmasters/thread?tid=3d63228b915dab32