Question

I am trying to wrap specific elements in a box if the visitor is using < IE9 so I can apply a box shadow across all browsers.

Unfortunately I cannot quite work out how to do it. Does anyone know how to convert the selected element back into HTML?

<script>
    $(document).ready(function() {
        $('img').each(function() {
            var img = $(this).clone();
            var html = '<div class="bounding">'+$(img)+'</div>';
            $(this).replaceWith(html);
        });
    });
</script>

The script is printing out [object Object]. .html() doesn’t work because that is basically innerHTML. Is there a jQuery function that achieves this?

Answer 1

Just use .wrap

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

Example – http://jsfiddle.net/BTJmn/