diff --git a/firmware/data/bottom.js b/firmware/data/bottom.js
index 4062715..40a1950 100644
--- a/firmware/data/bottom.js
+++ b/firmware/data/bottom.js
@@ -310,21 +310,26 @@ pwmElementTxt.innerText = pwmValue.toString();
 }
 updateLightStateAndPWMValues();
 setInterval(updateLightStateAndPWMValues, 5000);
-function sendRequest(id, value) {
+var links = document.querySelectorAll('[id^="on"][id$="_off"]');
+links.forEach(function(link) {
+link.addEventListener('click', function(event) {
+event.preventDefault();
+var id_full = this.id;
+var id = this.id.replace('on', '').replace('_off', '');
 var xhr = new XMLHttpRequest();
-xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=' + value + '&transition=' + document.getElementById('transition').value, true);
+xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=false&transition=' + document.getElementById('transition').value, true);
 xhr.onreadystatechange = function () {
 if (xhr.readyState === 4) {
-var button = document.getElementById(id + '_button');
+var button = document.getElementById(id_full);
 if (xhr.status === 200) {
 button.classList.remove("pure-button-primary");
 button.classList.add("success");
-button.innerHTML = (value ? "Enabled!" : "Disabled!");
+button.innerHTML = "Disabled!";
 button.style.backgroundColor = "green";
 setTimeout(function () {
 button.classList.remove("success");
 button.classList.add("pure-button-primary");
-button.innerHTML = (value ? "ON" : "OFF");
+button.innerHTML = "OFF";
 button.style.backgroundColor = "";
 }, 2000);
 console.log('Data successfully sent to server!');
@@ -336,7 +341,7 @@ button.style.backgroundColor = "red";
 setTimeout(function () {
 button.classList.remove("error");
 button.classList.add("pure-button-primary");
-button.innerHTML = (value ? "ON" : "OFF");
+button.innerHTML = "OFF";
 button.style.backgroundColor = "";
 }, 2000);
 showToast('Error while sending data to server.', 'error');
@@ -346,24 +351,55 @@ console.log('Error while sending data to server.');
 };
 xhr.send();
 updateLightState();
-}
-function addButtonClickListener(id, value) {
-var link = document.getElementById(id);
-link.addEventListener('click', function (event) {
-event.preventDefault();
-var id = this.id.replace('_button', '');
-sendRequest(id, value);
 this.classList.add('pure-button-primary');
-document.getElementById(id + (value ? '_off' : '_on') + '_button').classList.remove('pure-button-primary');
+document.getElementById('on'+id+'_on').classList.remove('pure-button-primary');
 });
-}
-function initializeButtons() {
-for (let i = 0; i <= {{LIGHT_COUNT}}; i++) {
-addButtonClickListener('on' + i + '_off_button', false);
-addButtonClickListener('on' + i + '_on_button', true);
+});
+var links = document.querySelectorAll('[id^="on"][id$="_on"]');
+links.forEach(function(link) {
+link.addEventListener('click', function(event) {
+event.preventDefault();
+var id_full = this.id;
+var id = this.id.replace('on', '').replace('_on', '');
+var xhr = new XMLHttpRequest();
+xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=true&transition=' + document.getElementById('transition').value, true);
+xhr.onreadystatechange = function () {
+if (xhr.readyState === 4) {
+var button = document.getElementById(id_full);
+if (xhr.status === 200) {
+button.classList.remove("pure-button-primary");
+button.classList.add("success");
+button.innerHTML = "Enabled!";
+button.style.backgroundColor = "green";
+setTimeout(function () {
+button.classList.remove("success");
+button.classList.add("pure-button-primary");
+button.innerHTML = "ON";
+button.style.backgroundColor = "";
+}, 2000);
+console.log('Data successfully sent to server!');
+} else {
+button.classList.remove("pure-button-primary");
+button.classList.add("error");
+button.innerHTML = "Error!";
+button.style.backgroundColor = "red";
+setTimeout(function () {
+button.classList.remove("error");
+button.classList.add("pure-button-primary");
+button.innerHTML = "ON";
+button.style.backgroundColor = "";
+}, 2000);
+showToast('Error while sending data to server.', 'error');
+console.log('Error while sending data to server.');
 }
 }
-initializeButtons();
+};
+xhr.send();
+updateLightState();
+this.classList.add('pure-button-primary');
+document.getElementById('on'+id+'_off').classList.remove('pure-button-primary');
+});
+});
 function createTable() {
 var table = document.createElement("table");
 table.border = "1";
diff --git a/firmware/html/bottom.js b/firmware/html/bottom.js
index c87e348..1b69507 100644
--- a/firmware/html/bottom.js
+++ b/firmware/html/bottom.js
@@ -357,71 +357,116 @@ function updateLightStateAndPWMValues() {
         })
         .catch(error => console.error(error));
 }
+
 updateLightStateAndPWMValues();
 setInterval(updateLightStateAndPWMValues, 5000);
 
-function sendRequest(id, value) {
-    // Erstelle eine neue Anfrage an die entsprechende URL
-    var xhr = new XMLHttpRequest();
-    xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=' + value + '&transition=' + document.getElementById('transition').value, true);
-
-    xhr.onreadystatechange = function () {
-        if (xhr.readyState === 4) {
-            var button = document.getElementById(id + '_button');
-            if (xhr.status === 200) {
-                button.classList.remove("pure-button-primary");
-                button.classList.add("success");
-                button.innerHTML = (value ? "Enabled!" : "Disabled!");
-                button.style.backgroundColor = "green";
-                setTimeout(function () {
-                    button.classList.remove("success");
-                    button.classList.add("pure-button-primary");
-                    button.innerHTML = (value ? "ON" : "OFF");
-                    button.style.backgroundColor = "";
-                }, 2000);
-                console.log('Data successfully sent to server!');
-            } else {
-                button.classList.remove("pure-button-primary");
-                button.classList.add("error");
-                button.innerHTML = "Error!";
-                button.style.backgroundColor = "red";
-                setTimeout(function () {
-                    button.classList.remove("error");
-                    button.classList.add("pure-button-primary");
-                    button.innerHTML = (value ? "ON" : "OFF");
-                    button.style.backgroundColor = "";
-                }, 2000);
-                showToast('Error while sending data to server.', 'error');
-                console.log('Error while sending data to server.');
-            }
-        }
-    };
-
-    // Sende die Anfrage im Hintergrund
-    xhr.send();
-    updateLightState();
-}
-
-function addButtonClickListener(id, value) {
-    var link = document.getElementById(id);
-    link.addEventListener('click', function (event) {
+// Suche nach allen Links auf der Seite mit IDs von on0_off bis on3_off
+var links = document.querySelectorAll('[id^="on"][id$="_off"]');
+// Füge einen Klick-Listener zu jedem Link hinzu
+links.forEach(function(link) {
+    link.addEventListener('click', function(event) {
+        // Verhindere, dass der Link die Seite neu lädt
         event.preventDefault();
-        var id = this.id.replace('_button', '');
-        sendRequest(id, value);
+        // Extrahiere die Zahl aus der ID des Links
+        var id_full = this.id;
+        var id = this.id.replace('on', '').replace('_off', '');
+        // Erstelle eine neue Anfrage an die entsprechende URL
+        var xhr = new XMLHttpRequest();
+        xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=false&transition=' + document.getElementById('transition').value, true);
+
+        xhr.onreadystatechange = function () {
+            if (xhr.readyState === 4) {
+                var button = document.getElementById(id_full);
+                if (xhr.status === 200) {
+                    button.classList.remove("pure-button-primary");
+                    button.classList.add("success");
+                    button.innerHTML = "Disabled!";
+                    button.style.backgroundColor = "green";
+                    setTimeout(function () {
+                        button.classList.remove("success");
+                        button.classList.add("pure-button-primary");
+                        button.innerHTML = "OFF";
+                        button.style.backgroundColor = "";
+                    }, 2000);
+                    console.log('Data successfully sent to server!');
+                } else {
+                    button.classList.remove("pure-button-primary");
+                    button.classList.add("error");
+                    button.innerHTML = "Error!";
+                    button.style.backgroundColor = "red";
+                    setTimeout(function () {
+                        button.classList.remove("error");
+                        button.classList.add("pure-button-primary");
+                        button.innerHTML = "OFF";
+                        button.style.backgroundColor = "";
+                    }, 2000);
+                    showToast('Error while sending data to server.', 'error');
+                    console.log('Error while sending data to server.');
+                }
+            }
+        };
+
+        // Sende die Anfrage im Hintergrund
+        xhr.send();
+        updateLightState();
         this.classList.add('pure-button-primary');
-        document.getElementById(id + (value ? '_off' : '_on') + '_button').classList.remove('pure-button-primary');
+        document.getElementById('on'+id+'_on').classList.remove('pure-button-primary');
     });
-}
+});
+// Suche nach allen Links auf der Seite mit IDs von on0_off bis on3_off
+var links = document.querySelectorAll('[id^="on"][id$="_on"]');
+// Füge einen Klick-Listener zu jedem Link hinzu
+links.forEach(function(link) {
+    link.addEventListener('click', function(event) {
+        // Verhindere, dass der Link die Seite neu lädt
+        event.preventDefault();
+        // Extrahiere die Zahl aus der ID des Links
+        var id_full = this.id;
+        var id = this.id.replace('on', '').replace('_on', '');
+        // Erstelle eine neue Anfrage an die entsprechende URL
+        var xhr = new XMLHttpRequest();
+        xhr.open('GET', 'http://{{IP_ADDRESS}}/?on' + id + '=true&transition=' + document.getElementById('transition').value, true);
 
-function initializeButtons() {
-    for (let i = 0; i <= {{LIGHT_COUNT}}; i++) {
-        addButtonClickListener('on' + i + '_off_button', false);
-        addButtonClickListener('on' + i + '_on_button', true);
-    }
-}
-
-initializeButtons();
+        xhr.onreadystatechange = function () {
+            if (xhr.readyState === 4) {
+                var button = document.getElementById(id_full);
+                if (xhr.status === 200) {
+                    button.classList.remove("pure-button-primary");
+                    button.classList.add("success");
+                    button.innerHTML = "Enabled!";
+                    button.style.backgroundColor = "green";
+                    setTimeout(function () {
+                        button.classList.remove("success");
+                        button.classList.add("pure-button-primary");
+                        button.innerHTML = "ON";
+                        button.style.backgroundColor = "";
+                    }, 2000);
+                    console.log('Data successfully sent to server!');
+                } else {
+                    button.classList.remove("pure-button-primary");
+                    button.classList.add("error");
+                    button.innerHTML = "Error!";
+                    button.style.backgroundColor = "red";
+                    setTimeout(function () {
+                        button.classList.remove("error");
+                        button.classList.add("pure-button-primary");
+                        button.innerHTML = "ON";
+                        button.style.backgroundColor = "";
+                    }, 2000);
+                    showToast('Error while sending data to server.', 'error');
+                    console.log('Error while sending data to server.');
+                }
+            }
+        };
 
+        // Sende die Anfrage im Hintergrund
+        xhr.send();
+        updateLightState();
+        this.classList.add('pure-button-primary');
+        document.getElementById('on'+id+'_off').classList.remove('pure-button-primary');
+    });
+});
 
 function createTable() {
     // Erstelle eine Tabelle