Jquery を使用して、クローン要素を追加し、以前に追加した要素を削除しようとしています。クローン要素の追加は機能しますが、以前に追加された要素の削除は機能しません (すべてのクローン要素が削除されます)。「not()」関数を使用していますが、希望どおりにフィルタリングされていません。
Webで検索しましたが、解決策が見つからなかったので、助けていただければ幸いです。
--HTML--
<div id="clone-container">
<!--cloned element comes here-->
</div>
<div id="original-container">
<ul>
<li>
<span>Value1</span>
</li>
<li>
<span>Value2</span>
</li>
<li>
<span>Value3</span>
</li>
</ul>
</div>
--Jquery--
$(document).ready(function(){
$('#original-container > ul > li').click(function(event){
//for adding clone elements
var $selected_clone = $(this).children("span").clone();
$selected_clone.appendTo("#clone-container > ul > li");
// for removing previously added elements
$("#clone-container > ul > li > span").not($selected_clone).remove();
});
});