Agregar Elementos con appendChild

CODE

    <h2>Agregar Elementos con appendChild</h2>

    <button onclick="agregarElementos()">Agregar Elementos</button>

    <!-- Contenedor donde se agregarán los elementos -->
    <div id="content-container"></div>

    <script>
        function agregarElementos() {
            // Obtener el contenedor
            const container = document.getElementById('content-container');
            
            // Crear un nuevo título (h3)
            const nuevoTitulo = document.createElement('h3');
            nuevoTitulo.textContent = "Título Agregado con appendChild";
            container.appendChild(nuevoTitulo);  // Agregar al contenedor
            
            // Crear un nuevo párrafo
            const nuevoParrafo = document.createElement('p');
            nuevoParrafo.textContent = "Este párrafo ha sido agregado dinámicamente al contenedor utilizando el método appendChild.";
            container.appendChild(nuevoParrafo);  // Agregar al contenedor
            
            // Crear un nuevo botón
            const nuevoBoton = document.createElement('button');
            nuevoBoton.textContent = "Nuevo botón";
            container.appendChild(nuevoBoton);  // Agregar al contenedor
        }
    </script>