JavaScript克隆一个内部HTML，然后基于克隆的文本创建新的div

棘手的情况

我需要从

ulli a

选择器中复制3个元素的内部html，然后注入一个新的div，该div使用类名作为复制的内部html

我设法在某种程度上注入了元素，但我还没有完成我需要的工作。

来自小提琴的jQuery：

(function($) {
    $('ul > li').each(function(){
        var html = $(this).html();
        $(this).html('<span class="">' + html + '</span>' + html);
    });
})(jQuery);

（函数（$）{
$（'ul>li'）。每个（函数（）{
var html=$（this.html（）；
$（this.html（“”+html+“”+html）；
});
})（jQuery）；

这是我需要的实际输出：

<ul> 
    <li><a href="#" class="btn btn-default"><span class="name1"></span>name1</a></li>
    <li><a href="#" class="btn btn-default"><span class="name2"></span>name2</a></li>
    <li><a href="#" class="btn btn-default"><span class="name3"></span>name3</a></li>
</ul>

我更喜欢JavaScript解决方案，但如果我能得到jQuery解决方案，我仍然会非常高兴

您可以尝试：

(function($) {
$('ul > li a').each(function(){
    var html = $(this).html();
    $(this).prepend($('<span>', {'class':html}));
});
})(jQuery);

（函数（$）{
$（'ul>li a'）。每个（函数（）{
var html=$（this.html（）；
$（this.prepend（$（''，{'class'：html}））；
});
})（jQuery）；

以下是jQuery解决方案，具体取决于所需的输出：

（函数（$）{
$（'ul>li'）。每个（函数（）{
var className=$（this.find（'a'）.text（）；
$（this.find（'a'）.prepend（''）；
});
})（jQuery）








您是否介意告诉我如何基于上述内容，同时将.text类添加到元素中？结果是：class=“btn btn default name2”等。只需在第二行末尾添加
.addClass（className）
。所以它应该是
$（this）.find（'a'）.prepend（''）.addClass（className）