Summernote : add new editor

by Adi Jaya

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>
<div id="main">
    <textarea name='name[]' class='demo'>Hello</textarea>
</div>

<p>
    <button class="add">ADD NEW EDITOR</button>
</p>

CSS

.note-editor {
    margin-bottom: 15px;
}

JavaScript

function init_summernote() {
    $(".demo").each(function () {
        var data = $(this).attr("data-editor");
        if (data == "ready") {
            return;
        } else {
            $(".demo").summernote({
                toolbar: ["bold", "italic", "underline","table","pre"]
            }).attr("data-editor", "ready");
        }
    });
}

function addEditor() {
    $("#main").append("<textarea class='demo' name='name[]'></textarea>");
    init_summernote();
}

$(document).ready(function () {
    init_summernote();
    $(document).on("click", ".add", function () {
        addEditor();
    });
});