Javascript getSelection（）仅在类中选择文本

我有contenteditable=true div，用户在这里输入他的反馈，我想允许他在用户单击colorplate时更改用div编写的选定文本的文本颜色

我有完整的代码来完成用用户想要的颜色更改所选文本颜色的任务。 但是 页面上的所有其他内容都可以选择并更改其颜色，这是我想要阻止的。我只允许更改class=comment的颜色

只是不明白如何用下面的代码来做

如果window.getSelection{//所有浏览器，版本9之前的IE除外 var selectionRange=window.getSelection； 如果selectionRange.isCollapsed{ 提醒：请先选择一些内容！； } 否则{ //动手 } }

感谢您的帮助

更新：包括突出显示功能

以下是JSFIDLE：

---

只有从注释类div only中选择文本时才会高亮显示

您研究过jQuerys的wrap或wrapInner方法吗？你可以在这里找到它们：|亲爱的Himanshu，你能修改由其他插件创建的动态类的代码吗DOM@user3525233哪个动态类？亲爱的Himanshu，我正在尝试使用emojiarea插件，当应用到textarea时，它会创建一个类名emoji wysiwyg编辑器。现在其他一切都好了。您的代码也可以完美地检测其他类，但不能检测这个类。任何帮助都会很好！！你能发布生成的html吗？这是新提琴。只需将highLightClass设置为要应用选择的类的名称。

$("#highlight").click(function(){
    var flag = 0;
    sel = window.getSelection();
    for (var i = 0; i < sel.rangeCount; i++) {
        var $sNode = $(sel.getRangeAt(i).startContainer.parentNode);
        var $eNode = $(sel.getRangeAt(i).endContainer.parentNode);
        if ($sNode.prop("class") == "comment" && $eNode.prop("class") == "comment"){
            $sNode.html($sNode.html().replace(sel,"<span class='selectedText'>"+ sel + "</span>"));
        }
    }
});