Question

I have an image that I need to wrap in a div:

currently doing this:

$('.photo-img').wrap('<div class="photo-wrap" />');

And then I need to take the float setting from the img and add it to the new div.

This the the HTML:

<img class="photo-img" style="margin-left: 10px; margin-right: 0px; float: right; width: 200px; height: 267px;" src="path/to/image.jpg" alt="">

and this is what I need it to be:

<div class="photo-wrap" style="float: right;">
   <img class="photo-img" style="margin-left: 10px; margin-right: 0px; float: right; width: 200px; height: 267px;" src="path/to/image.jpg" alt="">
</div>

Any help will be much apprciated.

C

Answer 1

var img = $('.photo-img');

img.wrap('<div class="photo-wrap" />').parent().css('float', img.css('float'));

jsFiddle.

…or alternatively…

$('.photo-img')
 .parent()
 .css('float', function() { return $(this).find('.photo-img').css('float'); })