jQuery: array of elements to raw html?

Question

Let's say I have an array like this:

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

I need to get the markup of the concatenated elements. So I need to convert content" into a raw string: "<p>...</p><p>...</p>".

How can this easily be done? Seems like there should already be something in the framework to do this.

Somehow maybe convert content into a document fragment and call .html() on the document fragment to get the markup?

Solution

Nothing automatic, but you could easily do what you just described.

Try it out: http://jsfiddle.net/Y5x5z/

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

var container = $('<div/>');

$.each(content, function(i,val) {
    container.append(val);
});

alert(container.html());

• http://api.jquery.com/jquery.each/
• http://api.jquery.com/append/ ​

Comments

[Admin]

Did you actually try running this bro? 'cause it don't work.

[aknosis]

@g33kz0r I guess you are right - updated it. The solution is not ideal but it does now work.

[Roman]

Try $.fn.append.apply($('<div>'), content).html()