diff --git a/amd/build/toggle_handler.min.js b/amd/build/toggle_handler.min.js
index 2d526b6..5d2ebe7 100644
--- a/amd/build/toggle_handler.min.js
+++ b/amd/build/toggle_handler.min.js
@@ -1,3 +1,3 @@
-define("local_ai_manager/toggle_handler",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0;_exports.init=inputid=>{const toggleContainer=document.getElementById(inputid);if(toggleContainer){const toggle=toggleContainer.querySelector("input");toggleContainer.addEventListener("click",(()=>{toggle.checked=!toggle.checked,toggle.dispatchEvent(new Event("change"))})),toggle.addEventListener("change",(()=>(toggle.checked?window.location.replace(toggle.dataset.targetwhennotchecked):window.location.replace(toggle.dataset.targetwhenchecked),!1)))}}}));
+define("local_ai_manager/toggle_handler",["exports"],(function(_exports){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0;_exports.init=inputSelector=>{const toggleContainer=document.querySelector(inputSelector);if(toggleContainer){const toggle=toggleContainer.querySelector("input");toggleContainer.addEventListener("click",(()=>{toggleContainer.dataset.checked=toggle.checked?"0":"1",toggle.checked=!toggle.checked,toggle.dispatchEvent(new Event("change"))}));toggle.dataset.targetwhenchecked&&toggle.dataset.targetwhenchecked.length>0&&toggle.dataset.targetwhennotchecked&&toggle.dataset.targetwhennotchecked.length>0&&toggle.addEventListener("change",(()=>(toggle.checked?window.location.replace(toggle.dataset.targetwhennotchecked):window.location.replace(toggle.dataset.targetwhenchecked),!1)))}}}));
 
 //# sourceMappingURL=toggle_handler.min.js.map
\ No newline at end of file
diff --git a/amd/build/toggle_handler.min.js.map b/amd/build/toggle_handler.min.js.map
index 8a3a813..f66f86e 100644
--- a/amd/build/toggle_handler.min.js.map
+++ b/amd/build/toggle_handler.min.js.map
@@ -1 +1 @@
-{"version":3,"file":"toggle_handler.min.js","sources":["../src/toggle_handler.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Toggle handler.\n *\n * @module      local_ai_manager/toggle_handler\n * @copyright   2024 ISB Bayern\n * @author      Philipp Memmel\n * @license     http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nexport const init = (inputid) => {\n    const toggleContainer = document.getElementById(inputid);\n    if (toggleContainer) {\n        const toggle = toggleContainer.querySelector('input');\n\n        toggleContainer.addEventListener('click', () => {\n            toggle.checked = !toggle.checked;\n            toggle.dispatchEvent(new Event('change'));\n        });\n\n        toggle.addEventListener('change', () => {\n            // New state incoming.\n            if (!toggle.checked) {\n                window.location.replace(toggle.dataset.targetwhenchecked);\n            } else {\n                window.location.replace(toggle.dataset.targetwhennotchecked);\n            }\n            return false;\n        });\n    }\n};\n\n\n"],"names":["inputid","toggleContainer","document","getElementById","toggle","querySelector","addEventListener","checked","dispatchEvent","Event","window","location","replace","dataset","targetwhennotchecked","targetwhenchecked"],"mappings":"oKAwBqBA,gBACXC,gBAAkBC,SAASC,eAAeH,YAC5CC,gBAAiB,OACXG,OAASH,gBAAgBI,cAAc,SAE7CJ,gBAAgBK,iBAAiB,SAAS,KACtCF,OAAOG,SAAWH,OAAOG,QACzBH,OAAOI,cAAc,IAAIC,MAAM,cAGnCL,OAAOE,iBAAiB,UAAU,KAEzBF,OAAOG,QAGRG,OAAOC,SAASC,QAAQR,OAAOS,QAAQC,sBAFvCJ,OAAOC,SAASC,QAAQR,OAAOS,QAAQE,oBAIpC"}
\ No newline at end of file
+{"version":3,"file":"toggle_handler.min.js","sources":["../src/toggle_handler.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Toggle handler.\n *\n * @module      local_ai_manager/toggle_handler\n * @copyright   2024 ISB Bayern\n * @author      Philipp Memmel\n * @license     http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nexport const init = (inputSelector) => {\n    const toggleContainer = document.querySelector(inputSelector);\n    if (toggleContainer) {\n        const toggle = toggleContainer.querySelector('input');\n\n        toggleContainer.addEventListener('click', () => {\n            // Click event will fire before status is being updated, so we have to invert 0 and 1 here.\n            toggleContainer.dataset.checked = toggle.checked ? '0' : '1';\n            toggle.checked = !toggle.checked;\n            toggle.dispatchEvent(new Event('change'));\n        });\n\n        // To make the toggle also usable without directly loading a page on changing the state\n        // we only add the listener here if both target attributes are set and not empty.\n        const useUrlsOnChange = toggle.dataset.targetwhenchecked && toggle.dataset.targetwhenchecked.length > 0\n            && toggle.dataset.targetwhennotchecked && toggle.dataset.targetwhennotchecked.length > 0;\n        if (useUrlsOnChange) {\n            toggle.addEventListener('change', () => {\n                // New state incoming.\n                if (!toggle.checked) {\n                    window.location.replace(toggle.dataset.targetwhenchecked);\n                } else {\n                    window.location.replace(toggle.dataset.targetwhennotchecked);\n                }\n                return false;\n            });\n        }\n    }\n};\n\n\n"],"names":["inputSelector","toggleContainer","document","querySelector","toggle","addEventListener","dataset","checked","dispatchEvent","Event","targetwhenchecked","length","targetwhennotchecked","window","location","replace"],"mappings":"oKAwBqBA,sBACXC,gBAAkBC,SAASC,cAAcH,kBAC3CC,gBAAiB,OACXG,OAASH,gBAAgBE,cAAc,SAE7CF,gBAAgBI,iBAAiB,SAAS,KAEtCJ,gBAAgBK,QAAQC,QAAUH,OAAOG,QAAU,IAAM,IACzDH,OAAOG,SAAWH,OAAOG,QACzBH,OAAOI,cAAc,IAAIC,MAAM,cAKXL,OAAOE,QAAQI,mBAAqBN,OAAOE,QAAQI,kBAAkBC,OAAS,GAC/FP,OAAOE,QAAQM,sBAAwBR,OAAOE,QAAQM,qBAAqBD,OAAS,GAEvFP,OAAOC,iBAAiB,UAAU,KAEzBD,OAAOG,QAGRM,OAAOC,SAASC,QAAQX,OAAOE,QAAQM,sBAFvCC,OAAOC,SAASC,QAAQX,OAAOE,QAAQI,oBAIpC"}
\ No newline at end of file
diff --git a/amd/src/toggle_handler.js b/amd/src/toggle_handler.js
index 7cd5fdc..6ab7da3 100644
--- a/amd/src/toggle_handler.js
+++ b/amd/src/toggle_handler.js
@@ -22,25 +22,33 @@
  * @license     http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
 
-export const init = (inputid) => {
-    const toggleContainer = document.getElementById(inputid);
+export const init = (inputSelector) => {
+    const toggleContainer = document.querySelector(inputSelector);
     if (toggleContainer) {
         const toggle = toggleContainer.querySelector('input');
 
         toggleContainer.addEventListener('click', () => {
+            // Click event will fire before status is being updated, so we have to invert 0 and 1 here.
+            toggleContainer.dataset.checked = toggle.checked ? '0' : '1';
             toggle.checked = !toggle.checked;
             toggle.dispatchEvent(new Event('change'));
         });
 
-        toggle.addEventListener('change', () => {
-            // New state incoming.
-            if (!toggle.checked) {
-                window.location.replace(toggle.dataset.targetwhenchecked);
-            } else {
-                window.location.replace(toggle.dataset.targetwhennotchecked);
-            }
-            return false;
-        });
+        // To make the toggle also usable without directly loading a page on changing the state
+        // we only add the listener here if both target attributes are set and not empty.
+        const useUrlsOnChange = toggle.dataset.targetwhenchecked && toggle.dataset.targetwhenchecked.length > 0
+            && toggle.dataset.targetwhennotchecked && toggle.dataset.targetwhennotchecked.length > 0;
+        if (useUrlsOnChange) {
+            toggle.addEventListener('change', () => {
+                // New state incoming.
+                if (!toggle.checked) {
+                    window.location.replace(toggle.dataset.targetwhenchecked);
+                } else {
+                    window.location.replace(toggle.dataset.targetwhennotchecked);
+                }
+                return false;
+            });
+        }
     }
 };
 
diff --git a/templates/toggle.mustache b/templates/toggle.mustache
index b0727e8..f751e64 100644
--- a/templates/toggle.mustache
+++ b/templates/toggle.mustache
@@ -25,7 +25,7 @@
         "text": "Toggle this to enable/disable what you want"
     }
 }}
-<div id="local_ai_manager_toggle-{{uniqid}}" class="custom-control custom-switch">
+<div class="custom-control custom-switch" data-toggle-identifier="{{identifier}}" {{#checked}} data-checked="1" {{/checked}}{{^checked}} data-checked="0" {{/checked}}>
     <input type="checkbox" class="custom-control-input"{{!
                 }} {{#checked}}checked{{/checked}}{{!
                 }} data-targetwhenchecked="{{{targetwhenchecked}}}"{{!
@@ -35,6 +35,6 @@
 </div>
 {{#js}}
     require(['local_ai_manager/toggle_handler'], function(ToggleHandler) {
-        ToggleHandler.init('local_ai_manager_toggle-{{uniqid}}');
+        ToggleHandler.init('[data-toggle-identifier="{{identifier}}"]');
     });
 {{/js}}