jQuery removes wrapping element

Question

I am loading a html file with jquery $.get and wrap the response. But jQuery removes my wrapper .

I made the following example which demonstrates my problem: https://jsfiddle.net/pwm76bp6/

Everyone who dont want to open the link here is the example code:

alert($('<div><div>Hallo</div></div>').html());

I would expect that the whole string should be alerted. Whats the problem here?

Possible duplicate of [Get selected element's outer HTML](http://stackoverflow.com/questions/2419749/get-selected-elements-outer-html) — str, Jun 28 '16 at 08:24
Why not `alert('
Hallo
');`. And, if you need insert that HMTL: `document.getElementById('receptor_id').innerHTML = '
Hallo
';`. — José M. Carnero, Jun 28 '16 at 08:27

score 2 · Answer 1 · edited Jun 28 '16 at 08:23

2

You need to read outerHTML property.

console.log($('<div><div>Hallo</div></div>').prop('outerHTML'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

edited Jun 28 '16 at 08:23

dippas

58,591
15
114
126

answered Jun 28 '16 at 08:22

Satpal

132,252
13
159
168

score 0 · Answer 2 · answered Jun 28 '16 at 08:21

0

Dynamically wrap it with an element, then get the html() of the wrapped element.

alert($('<div><div>Hallo</div></div>').wrap("<div></div>").parent().html());

answered Jun 28 '16 at 08:21

Anoop Joshi P

25,373
8
32
53

i think he needs to know why it didnt work in his :) – guradio Jun 28 '16 at 08:22

score 0 · Answer 3 · answered Jun 28 '16 at 08:23

0

It doesn't remove your wrapper. jQuery html() does return the contents of an element.

When you do $('<div>my content</div>') you creating an element, then you get the inner html with html() which is then alerted in your example.

answered Jun 28 '16 at 08:23

malifa

8,025
2
42
57

score 0 · Answer 4 · answered Jun 28 '16 at 08:23

0

With your code you will get the html of your outer element <div>. And the content of the outer <div> is <div>Hallo</div>.

You can do what you want with a default property:

alert($('<div><div>Hallo</div></div>')[0].outerHTML);

answered Jun 28 '16 at 08:23

eisbehr

12,243
7
38
63

score 0 · Answer 5 · answered Jun 28 '16 at 08:25

the function "html" does return the html content of a given element. In your case "html()" returns the content of the outer div, which excludes the outer itself.

You may can overcome this by wrapping your html like:

var html = '<div><div>Hallo</div></div>';
var outerHtml = $(html).wrap('<div />').parent().html();

hope this helps.

jQuery removes wrapping element

5 Answers5