删除与同一类的现有兄弟姐妹，但不是这样

Question

<div class="slides">
 <img class="item-1 cardone" src="images/cardone.jpg"/>
 <img class="item-2 cardtwo" src="images/cardtwo.jpg"/>
 <img class="item-3 cardthree" src="images/cardthree.jpg"/>
 <img class="item-4 cardfour" src="images/cardfour.jpg"/>
 <img class="item-5 cardfive" src="images/cardfive.jpg"/>
 </div>
<img class="cardone" src="images/cardone.jpg"/><!-- gets added to slides on click, existing image with same class removed at the same time-->
$('.cardone').click(function(){
    var newSrc = $(this).attr('class');
    $(this).insertAfter($('.slides img:nth-child(2)')).addClass('item-3');
    $('.slides img').not(this).removeClass(newSrc);
}); 

单击Cardone时，将其添加到幻灯片中，试图用同一类名称替换现有图像。我获得的最远的是删除类，而不是图像本身。

Answer 1

您可以像下面的那样做： -

 $("."+newSrc+"").not(this).remove();

示例： -

$('.cardone').click(function(){
    var newSrc = $(this).attr('class');
    $("."+newSrc+"").not(this).remove();
    $(this).insertAfter($('.slides img:nth-child(2)')).addClass('item-3');
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="slides">
 <img class="item-1 cardone" src="images/cardone.jpg"/>
 <img class="item-2 cardtwo" src="images/cardtwo.jpg"/>
 <img class="item-3 cardthree" src="images/cardthree.jpg"/>
 <img class="item-4 cardfour" src="images/cardfour.jpg"/>
 <img class="item-5 cardfive" src="images/cardfive.jpg"/>
 </div>
<img class="cardone" src="images/cardone.jpg"/> // gets added to slides on click, existing image with same class removed at the same time.