How to put XFBML code by ajax?

I would like to use javascript (JQuery) to ask the server for XFBML code via ajax. The XFBML code will then attached to the DOM.

Here it is the php code:

echo "
<fb:serverFbml>
    <script type=text/fbml'>
    <fb:fbml>
        <fb:request-form
            action='http://myserver.com/invited.php'
            method='post'
     开发者_StackOverflow       type='myserver'
            invite='true' 
            content='yo you...'>
            <fb:request-form-submit uid=12312312label='Send to %n ' import_external_friends=false />
        </fb:request-form>
        </fb:fbml>
  </script>
</fb:serverFbml>

"; 

and here is the javascript:

function clickME() {

    $.ajax(
            {
                url:'http://myserver.com/fbml_ajax.php',
                success:attachData,

                type:'GET',
                dataType:'html',
                global:false
            }
        );

}

function attachData(data) {
    var myData = data;
    $('#attachnow').html(data);
}

I can't make it work.. it is not attached.

If I just put the XFBML staticly on the HTML page, it works. but if I attach to DOM it doesn't.

Is it because of the tag? or is it because of the data that contains \r\n when return from from server?

You need to use FB.XFBML.parse on any new content. FBML is only parsed on page load by default. According to the second example in the page I linked, the exact code would be

FB.XFBML.parse(document.getElementById('attachnow'));

added as the last line of your attachData function.