Notice the difference in the descriptions:
.wrap(): Wrap an HTML structure around each element in the set of matched elements.
.wrapAll(): Wrap an HTML structure around all elements in the set of matched elements.
.wrap() wraps every element individually, but .wrapAll()
wraps all of them as a group.
For example:
<div class="foo"></div>
<div class="foo"></div>
<div class="foo"></div>
With $('.foo').wrap('<div class="bar" />');
, this happens:
<div class="bar"><div class="foo"></div></div>
<div class="bar"><div class="foo"></div></div>
<div class="bar"><div class="foo"></div></div>
But with $('.foo').wrapAll('<div class="bar" />');
, this happens:
<div class="bar">
<div class="foo"></div>
<div class="foo"></div>
<div class="foo"></div>
</div>
from :http://stackoverflow.com/questions/11946379/difference-between-jquery-wrap-and-wrapall
learn wrapInner: http://api.jquery.com/wrapInner/