Oi. Tudo bem?
Isso acontece porque o navegador não sabe que você quer limpar a lista antiga. Você precisa dar essa instrução no seu código.
A forma mais direta de "limpar" um elemento HTML que contém outros elementos (como uma <ul> que contém várias <li>) é definir a propriedade innerHTML dele como uma string vazia.
Como corrigir:
Você provavelmente tem uma função que é chamada quando você clica no botão de sortear. Vamos supor que ela se chame sortear().
Dentro dessa função, depois que você já pegou os nomes, realizou a lógica do sorteio e mostrou o resultado, você deve adicionar o comando para limpar a lista de "Amigos incluídos".
Assumindo que o id da sua lista de amigos (onde aparecem "Maria", "Joao", etc.) seja lista-amigos, o código seria assim:
function sortear() {
// 1. Aqui vai todo o seu código que pega os amigos da lista
// e faz a lógica do sorteio...
// 2. Aqui vai o código que mostra o resultado do sorteio na tela...
// 3. E aqui, você limpa a lista de "Amigos incluídos":
let listaDeAmigos = document.getElementById('lista-amigos');
listaDeAmigos.innerHTML = '';
}
Se você tiver um botão "Reiniciar"
Muitas vezes, a melhor solução para esse desafio é ter um botão "Reiniciar". A função desse botão seria limpar todos os campos para começar um jogo novo.
Se você tem um botão "Reiniciar", a sua função reiniciar() deveria ser a responsável por limpar a lista:
function reiniciar() {
// Limpa a lista de amigos incluídos (o seu problema)
document.getElementById('lista-amigos').innerHTML = '';
// Limpa também a lista com o resultado do sorteio (ex: "lista-sorteio")
document.getElementById('lista-sorteio').innerHTML = '';
// Se você guarda os amigos em um array, limpe o array também
// amigos = [];
}
Nesse segundo caso, você não colocaria o innerHTML = '' dentro da função sortear(). Você só chamaria a função reiniciar() quando quisesse começar um novo jogo.
Dessa forma, quando você adicionar um novo nome, a lista estará vazia e o novo nome será o primeiro item.
Espero ter ajudado,
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!
