How to pass the wp_editor content using jquery

Question

I want to add the wp_editor content using jquery.

I have hidden the wp_editor that needs to be displayed in the thickbox on one of the button click

<div class="hidden-editor-container" style = "display: none;">
    <?php wp_editor($page_content , 'hidePageContent'); ?>
</div>

How can I show this editor content into a wordpress thickbox? For example in below div(show-editor-container)

<div class="show-editor-container">
    <?php wp_editor('' , 'editPageContent'); ?>
</div>

I tried adding the below code in my js file but with no result:

var page_content = $("input#page_content").val();
$('.editPageContent').append(page_content);

Thanks in advance!

Answer 1

You have to access the tinymce object like this:

tinymce.get("your_textarea_ID_goes_here").setContent("Place your content here");

As a practical example - if you declared your wp_editor like this:

wp_editor( "", "special_content", array() );

Then the tinymce call would look like this:

tinymce.get("special_content").setContent("Place your content here");

Bonus details: if you want to grab the content from the editor use this command:

let editorContent = tinymce.get("your_textarea_ID_goes_here").getContent();

Cheers, Brian