jquery append() method on empty XML element

Question

This could just be a syntax error, but I'm trying to create a Document object from scratch, starting with document.implementation.createDocument() and then using jquery's append() method to add the elements. But it's not appending:

var myDoc = document.implementation.createDocument("", 'stuff', null);

$("stuff",myDoc).attr("test","tested");

$("stuff",myDoc).append("<test>A</test>");
$("<test>B</test>").appendTo("stuff",soapEnv);

var s = new XMLSerializer();
alert(s.serializeToString(soapEnv));

This should output:

<stuff test="tested">
    <test>A</test>
    <test>B</test>
</stuff>

But instead it outputs:

<stuff test="tested" />

So the selector seems to be working, just not the method. My only guess is the method doesn't account for the fact that elements are empty (<stuff />) until they have children. But that's just a guess.

Answer 1

You can't construct a non-HTML node using jquery. This means $('<test>X</test>') isn't going to work, but $('<span>X</span>') will. (You can use jQuery to read an XML document, and look for things like $('test'), but constructing them is another matter.) This is due to how jQuery creates these elements internally.

EDIT

Here is the documentation supporting my claim: http://api.jquery.com/jQuery/#jQuery2

A string of HTML to create on the fly. Note that this parses HTML, not XML.