I want to make the checkbox inout be checked as per the below snapshot code so when I click of any of the Todo Item (Buy Lunch,....etc.) the checkbox input be checked and after writing below code it is only applied on the first element only whatever I clicked any paragraph (Todo item).
// Clicking Todo Item to fire checked Input
let paragraphs =document.querySelectorAll('p');
let checkBoxInput = document.getElementById('checkedInput');
for(var i=0; i < paragraphs.length; i++){
paragraphs[i].addEventListener('click', function () {
this.style.color = "#2a6850";
checkBoxInput.checked = true;
}, false);
}
So how to click each todo list item not to click on checkbox itself and it being fired and make this like image not
EJS File:
<div class="item">
<input type="checkbox" name="" id="checkedInput">
<p>
<%= newItem %>
</p>
</div>
CSS
input:checked + p {
text-decoration: line-through;
text-decoration-color: #2da883;
}
Aucun commentaire:
Enregistrer un commentaire