Olá Professor! Terminei esse módulo, e por curiosidade e treino, quis colocar tudo em prática. Por isso, criei um código onde pretendo adicionar o nome, cpf, conta, depósito e saque. Na verdade, quero que a pessoa digite todos estes elementos e no final faça uma lista com o acréscimo do depósito e tambem do saque. Fiz uma parte onde consegui que o nome da pessoa fosse adicionado logo abaixo do nome. Gostaria que tudo fosse adicionado abaixo do botão total. Professor, criei este código a título de apredizagem, para tentar aplicar o que aprendi até agora. Agradeceria muito se o senhor me ajudasse nisso!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>Nome</h3> <input type="text" data-form-input id="nome" name="nome" placeholder="digite seu Nome aqui">
<ul class="list" data-list></ul>
<h3>CPF</h3> <input type="text" id="cpf" name="nome" placeholder="digite seu CPF">
<h3>Conta</h3> <input type="text" id="conta" name="nome" placeholder="digite sua Conta">
<h3>Deposito</h3> <input type="text" id="deposito" name="nome" placeholder="digite seu Depósito">
<h3>Saque</h3> <input type="text" id="saque" name="nome" placeholder="digite seu saque"> <br> <br> <br>
<button id="bottom" data-form-buttom>Total</button>
<script src="dadosBancos.js"></script>
</body>
</html>
const criarTarefa = (evento) => {
evento.preventDefault()
const lista = document.querySelector('[data-list]')
const input = document.querySelector('[data-form-input]')
const valor = input.value
const tarefa = document.createElement('li')
const conteudo = `<p class = "content">${valor}</p>`
tarefa.innerHTML = conteudo
lista.appendChild(tarefa)
input.value = ""
}
const novaTarefa = document.querySelector('[data-form-buttom]')
novaTarefa.addEventListener('click', criarTarefa)