用图标替换包含 的 div 的文本答案

【问题标题】：Replace text of a div which contain a with icon用图标替换包含 的 div 的文本
【发布时间】：2015-02-21 17:19:48
【问题描述】：

我想替换 div 的整个文本，但不删除其中的 span。

一旦用户单击ul 中的某个元素，我必须替换以下 div（“Yourself”）中的文本：

<div style="display: inline">
    <div class="text-light" style="float: left">Post as: </div>
    <div class="link toggle-post" style="float: right" >
        Yourself
        <span id="dropdownIcon" class="ui-icon-dropdown"></span>
    </div>
</div>

我正在使用以下代码：

$('[data-postas]').click(function changeHeader(event){
    var element = $(event.srcElement);
    $('.toggle-post').text().replace($('.toggle-post').text(), element.text());
    $('#postAs').val(element.attr('data-postas'));
    if (element.attr('data-company')){
        $('#company').val(element.attr('data-company'));
    }

    $('.icon-cheack').remove();
    element.append('<i class="icon-cheack fright"></i>');
    setTimeout(function() {
        $(".ul-post").toggle();
    }, 500);
    $('#dropdownIcon').addClass('ui-icon-dropdown');
})

文本没有被替换

【问题讨论】：

在替换整个 div 内容之前保存 span 的引用，然后重新附加 span
另一个想法是将“你自己”放入一个单独的，这样你就可以删除那个内容。

标签： javascript jquery text replace

【解决方案1】：

作为@BeNdErR 伤心，保存span，把icon，加回span：

//Save the old one
var span = $('#dropdownIcon');
//Empty the div
$('.toggle-post').empty().append('<i class="icon-cheack fright"></i>').append(span);

【讨论】：

我找到了一个相关的答案，我编辑了这个问题。不幸的是它不起作用:(为什么？
我没有看到任何相关的代码版本。但是你可以检查这个，使用inspect元素检查，div内容已经被替换了。
忘掉小提琴：jsfiddle.net/yan91mrg/
不，不是，在append里面有 这只是一个演示，当然你看不到图标，因为没有图片，还有css。但我很伤心，如果你看到检查元素，你会发现它就在那里。

【解决方案2】：

试试这个！

var sp = $('.toggle-post span.ui-icon-dropdown'); 
$('.toggle-post').html( "text to replace").append(sp);

【讨论】：