Question

<p>hello</p>
$("p").wrap("<div class='inner'></div>").wrap("<div class='outer'></div>");

The result is <div class="inner"><div class="outer"><p>hello</p></div></div>,

Why is it so? I expected inner inside outer, not otherwise.

Here is fiddle to play with : http://jsfiddle.net/qnYDY/

Was it helpful?

Solution 2

Because the wrap() method:

...returns the original set of elements for chaining purposes.

Source: http://api.jquery.com/wrap/

OTHER TIPS

I think the first wrap call returns "p" itself , so when you wrap it again, the "outer" div will wrap the "p" tag and not any of its parents.

As stated by Jamie Dixon wrap() returns the original set of arguments.

You could use parent() to append to the newly added element:

$("p").wrap("<div class='inner'></div>").parent().wrap("<div class='outer'></div>");
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top