How to convert jQuery object to XML/HTML?

Question

This is what I'm trying to do:

$('<abc/>').append('<x/>').html()

I expect it to be: "<abc><x/></abc>". Am I wrong?

please explain further, your question makes 0 sense right now — SpYk3HH, Mar 24 '12 at 05:11
I'm trying to build HTML from jquery elements. I just need to build this text: '' (for example). — yegor256, Mar 24 '12 at 05:12

score 2 · Accepted Answer · answered Mar 24 '12 at 05:16

2

You can hug your elements in a parent container as such:

$('<div>').append($('<abc/>').append('<x/>')).html()

You'll get the result you want:

answered Mar 24 '12 at 05:16

Marty Cortez

Thanks, you're right. But it doesn't work with XML+XSL. Looks like my problem is somewhere else. – yegor256 Mar 24 '12 at 05:20
this is the full problem: http://stackoverflow.com/questions/9834487. if you add your code there you will see the problem – yegor256 Mar 24 '12 at 05:24

score 0 · Answer 2 · answered Mar 24 '12 at 05:10

0

You should be adding an id attribute to your abc tag

<abc id="AbcId">

and referencing it like this:

$('#AbcId').append('<x/>')

answered Mar 24 '12 at 05:10

nightshifted

He is not referencing an already present element. He wants to create a new element $(''). – craftsman Mar 24 '12 at 05:12
I don't have an HTML page, I'm working with created on-fly jquery elements. You misunderstood the question – yegor256 Mar 24 '12 at 05:13
Okay, I see. Apologies for the misunderstanding. – nightshifted Mar 24 '12 at 05:25

score 0 · Answer 3 · answered Mar 24 '12 at 05:15

.html() returns child elements of the selected object. In your case, it should return this:

<x></x>

If you want to get out html, you can write a quick function:

$.fn.outerHTML = function() {
    return $('<div>').append( this.eq(0).clone() ).html();
};

Now if you re-write your code with outerHTML():

$('<abc/>').append('<x/>').outerHTML();

You will get this:

<abc><x><x/></abc>

SpYk3HH · Answer 4 · 2012-03-24T05:20:51.780

in that case, i guess what you have is close to correct, for instance, build a div with a header in it that says "Title";

$("<div />").append($("<h1 />").text("Title"))

or a div with a p element with a link in it after some text

$("<div />").append($("<p />").text("Mail Me Here:").append($("<a />").attr("href", "mailto:somemail@gmail.com").text("someMail@Gmail.com")))

append it to the body with

...eMail@Gmail.com"))).appendTo($("body"))

Keep in mind you can also .prepend and .prependTo elements

See an example of appending new table rows from data as

and then nothing unless you want to append it to something – SpYk3HH Mar 24 '12 at 05:19 — SpYk3HH, Mar 24 '12 at 05:19

mpm · Answer 5 · 2012-03-24T05:28:46.160

0

$("<abx>").append("<x/>")[0].outerHTML

result :

"<abx><x></x></abx>"

.html() only outputs the content of

$("<abx>")

edited Mar 24 '12 at 05:28

answered Mar 24 '12 at 05:22

mpm

5 Answers5