添加元素到另一個孩子，如果家長不包含

Question

我如何檢查每個div.item，看它是否確實不包含span.premium，然後添加一個新的跨越（我們稱之爲span.free）到div.screenshot？

<div id="video1" class="item"> 
 
    <div class="screenshot"> 
 
    <img src="image1.png" /> 
 
    </div> 
 
    <h3>I am Video 1</h3> 
 
</div> 
 
<div id="video2" class="item"> 
 
    <div class="screenshot"> 
 
    <img src="image2.png" /> 
 
    </div> 
 
    <h3>I am Video 2 <span class="premium">P</span></h3> 
 
</div> 
 
<div id="video3" class="item"> 
 
    <div class="screenshot"> 
 
    <img src="image3.png" /> 
 
    </div> 
 
    <h3>I am Video 3</h3> 
 
</div>

Answer 1

用一行代碼：

$('div.item:not(:has(span.premium))').find('.screenshot').append('<span class="free">NEW SPAN</span>'); 

DEMO：https://jsfiddle.net/wxL2ujf8/

Answer 2

您可以使用:has()，:not()和each()像

$('div.item:not(:has(span.premium))').each(function(){ 
    $('div.screenshot').append('<span class="free"></span>') 
});