I think I've read through the plete jQuery API documentation and looked at jQuery objects and simple DOM elements in the debugger to check what methods they actually have at runtime, but for the life of me, I can't find a way to get the html string that represents the contents of a jQuery object or a DOM Node. Am I missing something?
jQuery objects have the method html()
, DOM elements have the property innerHTML
but both only give the inner html of the object. So if I have HTML like this:
<body>
<div>
<p>Hello World!</p>
</div>
</body>
And I use jQuery doing something like this var $div = $body.find("div")
and I then call $div.html()
the returned string is "<p>Hello World!</p>"
. But I'm looking for a way to make it return "<div><p>Hello World!</p></div>"
(I don't care about the whitespace).
What am I doing wrong? It can't be that difficult to get the html representation of these objects, can it?
I think I've read through the plete jQuery API documentation and looked at jQuery objects and simple DOM elements in the debugger to check what methods they actually have at runtime, but for the life of me, I can't find a way to get the html string that represents the contents of a jQuery object or a DOM Node. Am I missing something?
jQuery objects have the method html()
, DOM elements have the property innerHTML
but both only give the inner html of the object. So if I have HTML like this:
<body>
<div>
<p>Hello World!</p>
</div>
</body>
And I use jQuery doing something like this var $div = $body.find("div")
and I then call $div.html()
the returned string is "<p>Hello World!</p>"
. But I'm looking for a way to make it return "<div><p>Hello World!</p></div>"
(I don't care about the whitespace).
What am I doing wrong? It can't be that difficult to get the html representation of these objects, can it?
Share Improve this question edited May 9, 2013 at 16:42 Joachim Kurz asked May 9, 2013 at 16:40 Joachim KurzJoachim Kurz 3,0706 gold badges26 silver badges43 bronze badges 2- possible duplicate of How to get the innerHtml, including the tag, using jQuery? – epascarello Commented May 9, 2013 at 16:42
- Duplicate: stackoverflow./questions/2419749/… – Niels Commented May 9, 2013 at 16:43
3 Answers
Reset to default 8try the dom property .outerHTML
You can use the '.outerHTML' property. This is how it would look using jquery: http://jsfiddle/MHvmm/
$('div')[0].outerHTML
This is possible by enclosing your desired object in another object, and the fetching the innerHTML. It is explained in much more detail here: How do you convert a jQuery object into a string?