necesito crear un generador de contenido dinamico que sea capaz de guardar una copia del contenido creado para poder volver a seguir generando mas contenido en un segundo momento
<!-- mini generador de contenidos -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
//esta funcion crea un elemento div con dentro un parrafo
/*cuando codificaba mi funcion me preguntaba si fuera posible crear los elementos y agregarlos al dom sin usar las variables porque me parece un poco absurdo usarlas para cada cosa si al final de cuentas nunca es variable */
function generacion(){
contenido = document.body;
elemento = document.createElement('div');
capa = contenido.appendChild(elemento);
parrafo = document.createElement('p');
parrafocreado = capa.appendChild(parrafo);
parrafocreado.innerHTML="editar parrafo"
}
/*aqui me viene la pregunta de que manera puedo editar singularmente cada parrafo que genero, debo hacer un ciclo for? */
function editar()
{
parrafos = document.getElementsByTagName('p');
campo = document.getElementById('campo').value;
parrafos[0].innerHTML = campo;
}
</script>
</head>
<body>
<h4>gestor de contenidos</h4>
<button onclick="generacion()">generar elemento</button>
<div>
<p>parrafo editable</p>
<button onclick="editar()">edit</button>
<input type="text" id="campo">
</div>
</body>
</html>