使用jQuery创建一个包含目标div的div

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') );

Answer 2

var $myDiv = $('<div>').css('background-color','#fff').append( $('.myclass') ); 

然后，您可以根据需要将此变量写入DOM，或执行其他任何需要做的事情。