Javascript 将Html添加到没有子元素的文本中

我对如何获得这项工作感到非常困惑，在网上做了很多研究来帮助找到解决方案，但一无所获。在这里找到了这个链接：但仍然没有多大帮助

这就是我试图完成的，系统输出的文本是这样的，我无法控制html

<div class="myclass"> 
Text 1 
Text 2
Text 3        
</div>` 

文本1
文本2
文本3
` 

但是我想使用jquery在这些文本周围插入html 例如：

<div class="myclass"> 
 <span>Text 1 </span> 
 <span> Text 2 </span> 
 <span> Text 3</span>
 </div>

文本1
文本2
文本3

谢谢你的帮助

---

非常感谢

还有其他方法。这将满足这个问题

$(function(){

  stuff=$('.myclass').text().split("\n");

  newhtml='';
  $.each(stuff, function(i,o){
    if (o!=''){
      newhtml +='<span>' + o + '</span>'."\n";
    }
  });
  $('.myclass').html(newhtml);

});

$（函数（）{
stuff=$（'.myclass'）.text（）.split（“\n”）；
newhtml=''；
$。每个（材料、功能（i、o）{
如果（o！=''）{
新HTML+=''+o+''。\n；
}
});
$（'.myclass'）.html（newhtml）；
});

这应该对其进行排序：

var theDivs = document.getElementsByClassName('myclass');

for(var i in theDivs)
{
    if(parseInt(i)==i)
    {
        var div = theDivs[i];
        var text = div.innerHTML.split("\n");
        for(var k in text)
        {
            var trimmed = text[k].replace(/^\s+|\s+$/,'');
            if(trimmed != '') text[k] = '<span>'+trimmed+'</span>';
            else text[k] = trimmed;
        }
        div.innerHTML = text.join("\n");
    }
}

var theDivs=document.getElementsByClassName（'myclass'）；
用于（第i个变量在第4个变量中）
{
if（parseInt（i）=i）
{
var div=第四个变量[i]；
var text=div.innerHTML.split（“\n”）；
for（文本中的var k）
{
var trimmed=text[k]。替换（/^\s+|\s+$/，“”）；
如果（修剪！=''）文本[k]=''+修剪+''；
else text[k]=已修剪；
}
div.innerHTML=text.join（“\n”）；
}
}
$（'.myclass'）.html（函数（i，v）{
返回'+$.trim（v）.split（'\n'）.join（''）+''；
});

可能的重复：
$('.myclass').html(function(i, v){
    return '<span>' + $.trim(v).split('\n').join('</span><span>') + '</span>';
});