fbjs setInnerFBML does not work in Safari

Question

Hi I am having problems using fbjs and creating a div dynamically and then using appendChild to append it to an existing div.

heres an example:

var count = 0;
function addDiv(){
    var theDiv = document.createElement('div');
    theDiv.setId(count);
    theDiv.setInnerFBML('some html here');

    count++; 
    document.getElementById('someExistingDiv').appendChild(theDiv);
}

can anyone please tell me whats wrong or if there are any issue with appendChild inSafari when using setInnerFBML. This works perfectly fine when using setTextValue.

P.S It works it Firefox but not in Safari (Safari 4.0.3 to be specific)

Thanks

UPDATE:

it worked on the first div appended and failed after

Answer 1

It turned out that this was a known bug that has yet to be fixed. For now I created a workaround and Im posting it here for future references.

Since setInnerFBML worked on the first append and failed after (no idea why), I've decided to clone the first div appended and use it for future appends. Heres my code.

var count = 0;
function addDiv(){
    if(count == 0){
        var theDiv = document.createElement('div');
        theDiv.setInnerFBML('some html here');
    }else{
        var theDiv = document.getElementById('0').cloneNode(true);
    }

    theDiv.setId(count);
    count++; 

    document.getElementById('someExistingDiv').appendChild(theDiv);
}

Hope this helps someone.

Answer 2

setInnerFBML only takes pre-rendered FBML, so it either has to come from a FBML ajax request or be prerendered in a fb:js-string tag. It cannot be generated on the fly.