diff --git a/public/script.js b/public/script.js
index 9c6912e..a71b738 100644
--- a/public/script.js
+++ b/public/script.js
@@ -10,3 +10,13 @@ document.addEventListener('DOMContentLoaded', () => {
     // Load tasks will be called here later (Issue #9)
 });
 
+//add task complete toggel
+function toggleTask(id) {
+    tasks = tasks.map(task => {
+        if (task.id === id) {
+            return { ...task, completed: !task.completed };
+        }
+        return task;
+    });
+    renderTasks();
+}
diff --git a/public/style.css b/public/style.css
index 01d4310..3c23224 100644
--- a/public/style.css
+++ b/public/style.css
@@ -19,4 +19,9 @@ body {
     display: flex;
     flex-direction: column;
 }
+.task-item.completed span {
+    text-decoration: line-through;
+    color: #888;
+}
+