Brussels | ITP-2025-1 | Preeti Tyagi | Week 9 | Sprint-3 | feature/to-do-list

Sprint-3/todo-list/index.html

@@ -34,7 +34,9 @@ <h1>My ToDo List</h1>
         </div>
       </li>
     </template>
-
+    <div>
+      <button id="delete-completed-btn">Delete Completed</button>
+    </div>
   </div>
 </body>
 </html>

Sprint-3/todo-list/script.mjs

@@ -1,3 +1,4 @@
+
 // Store everything imported from './todos.mjs' module as properties of an object named Todos 
 import * as Todos from "./todos.mjs";
 
@@ -45,7 +46,16 @@ function render() {
   });
 }
 
-
+  // Delete completed tasks button
+  document.getElementById("delete-completed-btn").addEventListener("click", () => {
+    // Keep only tasks that are NOT completed
+    for (let i = todos.length - 1; i >= 0; i--) {
+      if (todos[i].completed) {
+        Todos.deleteTask(todos, i); // call your module function
+      }
+    }
+    render();
+  });
 // Note:
 // - First child of #todo-item-template is a <li> element.
 //   We will create each ToDo list item as a clone of this node.
@@ -73,4 +83,4 @@ function createListItem(todo, index) {
   });
 
   return li;
-}
+}