execCommand - оборачивает содержимое, включая теги, в теги blockquote

Question

Я пытаюсь обернуть некоторые выбранные элементы в <blockquote> теги, но метод, который я думал, мог бы работать, заменяет существующие теги, а не оборачивает их.

Вот мой код

$("input[value='Quote']").on("click", function() {
    document.execCommand('formatBlock', false, '<blockquote>');
});

а также...

<div contentEditable>
    <p>para 1</p>
    <p>para 2</p>
</div>

<input type="button" value="Quote" />

Я хочу закончить с чем-то вроде этого...

<div contentEditable>
    <blockquote>
        <p>para 1</p>
        <p>para 2</p>
    </blockquote>
</div>

а не следующее, что я сейчас получаю...

<div contentEditable>
    <blockquote>
        para 1
        <br />
        para 2
    </blockquote>
</div>

Спасибо

Answer 1

Это должно сделать это

$("input[value='Quote']").on("click", function() {
  $("<blockquote/>").insertBefore($("[contenteditable]").find("p:first")).append($("[contenteditable]").find("p"))
});