A. Change the implementation of the click event applied to the list items, to allow you to switch between "scratched" items, that is, if an item does not is marked, the style for marking applies. If you are already marked, this style is removed, so that it returns to normal.
B. Create a new button in HTML, with the text "Clear Completed". Program the click event of this button to remove all items from the list that have been "crossed out" because they have already been marked by not affecting other items.
C. Schedule a double-click event (dblclick) for list. The item that is triggered with a double-click must be removed permanently on the list. Do not modify the click functionality, just create a new standalone event.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>Exercício 01</title>
</head>
<body>
<h1>Lista de Tarefas</h1>
<input id="texto" placeholder="O que precisa ser feito?">
<button id="adicionar">Adicionar</button>
<button id="limparTudo">Limpar Tudo</button>
<ul id="lista"></ul>
<script src="jquery-3.1.0.min.js"></script>
<script>
$('#limparTudo').hide()
$('#adicionar').click(() => {
const valor = $('#texto').focus().val()
if (valor) {
$('#limparTudo').show()
$('#texto').val('')
$('<li>')
.text(valor)
.appendTo('#lista')
.click(() => $(event.target).css('text-decoration', 'line-through'))
}
})
$('#texto').focus().keyup(() => {
if (event.keyCode === 13) $('#adicionar').click()
})
$('#limparTudo').click(() => {
$('#lista li').remove()
$('#limparTudo').hide()
$('#texto').val('').focus()
})
</script>
</body>
</html>
Someone can do it for me I do not understand or at least tell me what kind of code each exercise uses.