javascript - 单击并添加 div 但将其删除到其他元素

Question

我正在尝试制作一个脚本，当我点击一个列表时它会在标签内添加一个 div <li>，这个没问题，但我的问题是，当我点击另一个时，<li>我想在插入之前删除 div 我怎么能这样做，我也想删除类 .selected 吗？谢谢。

$(document).on('click', '#horiz_container img', function() {
            var img_selected = $(this);
            var value_sport = img_selected.val();
            if (!$(this).closest('li').is('.selected')) {

                $(this).closest('li').addClass('selected');
                $(this).closest('li').prepend('<div class="selected_sport"><img src="' + CI_ROOT +'resources/img/select.png"></div>');
            }

        });

Answer 1

尝试

$(document).on('click', '#horiz_container img', function () {
    var img_selected = $(this), $li = img_selected.closest('li');
    var value_sport = img_selected.val();
    var $selected = $('#horiz_container .selected').removeClass('selected');
    $selected.find('.selected_sport').remove();

    $li.addClass('selected');
    $li.prepend('<div class="selected_sport"><img src="' + CI_ROOT + 'resources/img/select.png"></div>');

});

Answer 2

$(document).on('click', '#horiz_container img', function() {
            var img_selected = $(this);
            var value_sport = img_selected.val();
            if (!$(this).closest('li').is('.selected')) {

                $(this).closest('li').addClass('selected');
                **$('.selected_sport').remove();**
                $(this).closest('li').prepend('<div class="selected_sport"><img src="' + CI_ROOT +'resources/img/select.png"></div>');
            }

        });