Javascript 更改所选文本的背景色，HTML JQUERY

我最近自定义了一个现有代码，通过选择文本的一部分，然后对其着色，将纯文本分为四个类，然后检索每个类的文本并将其存储在我的数据库中，该代码运行良好，但我希望拒绝嵌套span（确定类的html标记） 例如：

text-->已接受
文本-->不接受。

我应该在代码中添加什么

---

PS：在我选择文本的一部分后，我将鼠标光标悬停在四个类（1.2.3.4）中的一个上，为所选文本的背景上色，你可以自己在上面的链接上尝试，我只想做一些类似的事情，更紧凑。我想你明白了

$（'table td'）.mouseenter（函数（）{
$（this.addClass（'hilited'+$（this.attr（'id'））；
}).mouseleave（函数（）{
$（this.removeClass（'hilited'+$（this.attr（'id'））；
});
.hilite1{颜色：绿色}
.hilited2{颜色：红色}
.hilited3{颜色：蓝色}
.hilited4{颜色：黄色}

在我身上盘旋1班
在我身上盘旋2班
在我身上停留3班
在我身上盘旋4班
像这样做，更紧凑。我想你明白了


$（'table td'）.mouseenter（函数（）{
$（this.addClass（'hilited'+$（this.attr（'id'））；
}).mouseleave（函数（）{
$（this.removeClass（'hilited'+$（this.attr（'id'））；
});
.hilite1{颜色：绿色}
.hilited2{颜色：红色}
.hilited3{颜色：蓝色}
.hilited4{颜色：黄色}

在我身上盘旋1班
在我身上盘旋2班
在我身上停留3班
在我身上盘旋4班
谢谢您的回复。但这不是我想要的，首先我必须选择一个文本，然后选择一个类来为所选文本的背景着色谢谢你的回复。但这不是我想要的，首先我必须选择一个文本，然后选择一个类来为所选文本的背景着色
<span class="class1"> text text text </span> ----> accepted
 <span class= class1"> tex <span class="class 2> text  </span> text </span>--> not accepted.