我如何用p标签包装每个li元素

Question

我有一个结构dom：

    <div class="reditor_body">
      <p>saeed<p>
      <p>aghaebrahimain</p>
    </div>

当我选择了p标签并单击有序列表按钮时，结构如下：

<div class="reditor_body">
<ol>
    <li>saeed<li>
    <li>aghaebrahimain</li>
</ol>
</div>

我的问题是，当我选择li或同时选择li的每一个并再次单击有序列表按钮时，结构变为：

<div class="reditor_body">
     saeed
     aghaebrahimain
</div>

而我想要以下结构：

 <div class="reditor_body">
    <p>saeed<p>
    <p>aghaebrahimain</p>
 </div>

我该如何使用ckeditor或tinymce之类的javascript或jquery解决此问题？

小提琴

Answer 1

改变你的jQuery代码记住除去<p>标记（在情况下，可能是任何其他元件来代替<p>并删除列表元素换行文本与预先保存的元件（例如，当相同比<p>标签

Answer 2

首先.unwrap() ol并在jquery中使用.replaceWith()替换p标签而不是li

$(".reditor_body ol").click(function() {

$(".reditor_body ol li").unwrap("ol").replaceWith(function() {
    return $("<p></p>").append($(this).html());
});

});

Fiddle