Estoy usando javascript para crear y animar un formulario html. Debido a la acción sobre él, algunos campos se muestran o no. Algunos contenidos se crean dinámicamente. Estoy tratando de inicializar un select2 después de su creación dinámica. He desarrollado diferentes funciones.

En primer lugar, el initializeSelect2(element) se puede ver a continuación:

Esta función me ayuda a inicializar diferentes selecciones con las mismas especificaciones.

Cuando llegué a mi página, una función .each() se repite en mi select2 para aplicar la inicialización.

Entonces podemos obtener en mi página web esta vista:

Entonces, cuando elige un elemento, algunos campos se agregan dinámicamente al formulario. Para esto, hay una función que crea contenido html y otra que muestra estos campos en el DOM. Cuando se agrega algún contenido nuevo, hago la función initializeSelect2() . Y sorpresa, la vista de mi select en la página web no es la misma. Como puede ver abajo :

Primero, estaba pensando que era una cuestión de tiempo. Entre el momento en que se crea el contenido y el momento en que se hace el init. Pero no parece ser eso.

Traté de mover la función a otro lugar, pero siempre tengo el mismo problema. O el init no funciona o el init se ve diferente.

Por favor, si conoce una solución o tal vez una idea que pueda ayudarme. Gracias