Question

I think that this should be easy, but I’m not able to get it working. I want to target a div or other element using jQuery and then dynamically create a div containing the targeted element, for example:

jQuery (‘.myclass’)

How can I create a div with the background-color attribute set to white that contains ‘myclass’ element?

Initially I have: <div class="myclass">Some HTML elements inside</div>

And after executing the jQuery call i want to have: <div style="background-color:#fff"><div class="myclass">Some HTML elements inside</div></div>

I hope that you understand my question…

Answer 1

You can use the wrap function to put a wrapper around the matching elements. I’d prefer to use a class for the background, but you can assign CSS properties directly as well.

$('.myclass').wrap( $('<div></div>').css( 'background-color', '#fff' ) );

or

$('.myclass').wrap( $('<div></div>').addClass('white-background') );