Estoy haciendo un metodo que me cree nuevos elementos HTML con JS y necesito que cuando agregue un campo llamado notas me lo inserte siempre al final.
Este es todo mi codigo
<script>
function agregar() {
let campos = document.createElement('div');
campos.innerHTML = `
<br>
<center><div class="duplicate" id="duplicate">
<h3>Hora Requerida</h3>
<input type="date" name="" id="">
<input type="text" class=""> <br><br>
<input onclick="agregar()" type="button" value="Agregar nueva hora">
</div></center>
<br><br>
<center><div class="anotaciones" id="anotaciones">
<h2>Notas por Agregar</h2>
<textarea class="area" name="" id="" cols="30" rows="10"></textarea> <br><br>
<input type="button" onclick="notas()" value="Agregar más notas">
</div></center>
<br>
`;
document.getElementById('duplicates').appendChild(campos);
}
</script>
<script>
function notas(){
let notas = document.createElement('div');
notas.innerHTML = `
<br>
<center><div class="anotaciones" id="anotaciones">
<h2>Notas por Agregar</h2>
<textarea class="area" name="" id="" cols="30" rows="10"></textarea> <br><br>
<input type="button" onclick="notas()" value="Agregar más notas">
</div></center>
<br>
`;
document.getElementById('notas').appendChild(notas);
}
</script>
<div class="container" id="container">
<center><div class="duplicate" id="duplicate">
<h3>Hora Requerida</h3>
<input type="date" name="" id="">
<input type="text" class=""> <br><br>
<input onclick="agregar()" type="button" value="Agregar nueva hora">
</div></center>
<br>
<center><div class="anotaciones" id="anotaciones">
<h2>Notas por Agregar</h2>
<textarea class="area" name="" id="" cols="30" rows="10"></textarea> <br><br>
<input type="button" onclick="notas()" value="Agregar más notas">
</div></center>
<br>
<div class="notas" id="notas">
</div>
<div class="duplicates" id="duplicates">
</div>
</div>
El problema es que cuando duplico todo el formulario, el me lo crea pero quiero agregar una nota nueva a ese usuario, pero la inserta arriba y no siempre al final. Entonces siempre que se añade una nueva nota me queda arriba del formulario y no al final.