I am using a button click to add TinyMCE dynamically. Everything is working except only one issue is that only the last one is writeable.
Below is my HTML
HTML
<div id='add_content_box'></div>
<button id='add_more_content_block' class='button'>Add more content</button>
and this is my Javascript to create and initialize TinyMCE wp.editor.initialize(‘editor_id’);
Javascript
var counter = 1;
document.getElementById('add_more_content_block').addEventListener('click', function(e) {
e.preventDefault();
var editor_id = "editor_"+counter;
// document.getElementById('wp-editor_0-editor-container').innerHTML += `<textarea name="_hus_landing_page_content[`+counter+`]" id="editor_`+counter+`" ></textarea>`
document.getElementById('add_content_box').innerHTML += `<div class="wp-`+editor_id+`-editor-container">
<textarea class="wp-editor-area" name="_hus_landing_page_content[]" id="`+editor_id+`" ></textarea>
</div>`;
wp.editor.initialize(editor_id,{
mediaButtons: true,
tinymce: true,
quicktags: true
});
counter++;
});
I also have enqueued the scripts for editor.
PHP enqueue script
add_action( 'admin_enqueue_scripts', 'load_admin_scripts');
function load_admin_scripts() {
wp_enqueue_editor();
}
I am not much familiar with WordPress TinyMCE API.
