使用jquery删除第一个li元素中的第一个img

Question

我有一个像这样的HTML

<ul class="products">
    <li>
        <a href="#" class="product-images">
            <span class="featured-image">
                <img src="img1.jpg"/>
                <img src="img1-1.jpg"/>

            </span>
        </a>
    </li>
    <li>
        <a href="#" class="product-images">
             <span class="featured-image">
                <img src="img2.jpg"/>
                <img src="img2-2.jpg"/>
             </span>
        </a>            
    </li>

//some other li elements
</ul>

我想要做的是在 first li 元素中获取拳头图像，然后使用jQuery删除它。

我尝试了什么

jQuery (document).ready(function(){
        jQuery('.products li:first .featured-image img:first').remove();
});

但是这会在第一个范围内删除所有img。

任何帮助都是适当的。

Answer 1

您可以先选择li，然后在其中找到第一个img并将其删除DEMO。

$('.products li').first().find('img').first().remove()

另一种方法是

$('.products li:first img:first').remove()

Answer 2

这适合我，我在那里寻找第一个img元素的第一个直接孩子 .featured-image

jQuery (document).ready(function(){
    jQuery('.featured-image:first > img:first').remove();
});