然后换行元素在其中附加另一个元素

Question

看看这段代码

<div class="preview">
    <img src="link" alt="" class="overlay" />
</div>

我需要做的是包装内部div调用＆＃34; overlay＆＃34;然后添加另一个名为＆＃34; overlay2＆＃34;如下所示

<div class="preview">
    <div class="overlay">
        <img src="link" alt="" class="overlay" />
        <div class="overlay2"></div>
    </div>
</div>

我试图使用.wrap并附加但我不知道如何使用一个命令

Answer 1

你可以试试这个

$('div.preview img')
.wrap('<div class="overlay"></div>')
.after('<div class="overlay2"></div>');

DEMO（见来源）。

或者

$('div.preview img')
.wrap($('<div/>', {'class':'overlay'}))
.after($('<div/>', {'class':'overlay2'}));

DEMO（见来源）。

输出

<div class="preview">
    <div class="overlay">
        <img src="link" alt="" class="overlay">
        <div class="overlay2"></div>
    </div>
</div>

Answer 2

非常简单

$('.preview').append('<div class="overlay2"></div>')
$('.overlay').wrap('<div class="overlay"></div>')

在此测试：http://jsfiddle.net/RASG/32JSW/

Answer 3

var imgElement = $('div.preview').find('.overlay');  
$('div.preview').remove('img.overlay');    
$('div.preview').append("<div class='overlay'></div>");    
$('div.overlay').append(imgElement);  
$('img.overlay').after("<div class='overlay2'></div>");