Estoy tratando de agregar el código de mi sitio web html desde data-prototype :

 <div id="accordion" data-prototype=' <div class="card-body"> <textarea id="solution_answers___name___content" name="solution[answers][__name__][content]" required="required"></textarea> <script type="text/javascript"> var CKEDITOR_BASEPATH = "/bundles/fosckeditor/"; </script> <script type="text/javascript" src="/bundles/fosckeditor/ckeditor.js"></script> <script type="text/javascript"> if (CKEDITOR.instances["solution_answers___name___content"]) { CKEDITOR.instances["solution_answers___name___content"].destroy(true); delete CKEDITOR.instances["solution_answers___name___content"]; } </script> </div>'></div>

Como puede ver, también hay código js de ckeditor.

Cuando trato de agregarlo con jquery :

 let el = document.querySelector('#accordion'); let template = el.dataset.prototype; let $root = $(el); $root.append(template);

Todo funciona bien, quiero decir que no hay errores en la consola.

Cuando trato de agregarlo con vanilla js:

 let el = document.querySelector('#accordion'); let template = el.dataset.prototype; const scriptEl = document.createRange().createContextualFragment(template); el.append(scriptEl);

En la consola de desarrollo, recibo un error:

 Uncaught ReferenceError: CKEDITOR is not defined

Si ejecuto el mismo script una vez más, el error desaparece y todo funciona como se esperaba.

¿Alguien sabe por qué me sale ese error?

Aquí está el contenido de /bundles/fosckeditor/ckeditor.js