Question

How do I add a div starter “<div class='abc'>” to
<img src="bla.jpg" class="xyz"/> and end it with “</div>“
So that the DOM will be:

<div class='abc'>
   <img src="bla.jpg" class="xyz"/>
</div>      

I tried using this jQuery code:

$('img.xyz').before("<div class='abc'>").after("</div>");

But it gives me the DOM as:

<div class='abc'></div>
<img src="bla.jpg" class="xyz"/>

Answer 1

$('img.xyz').wrap('<div class="abc" />');

http://api.jquery.com/wrap