Das ist die kritische Zeile:
item.removeAttribute("open");
Den Effekt wirst du nicht zu sehen bekommen, weil der Browser danach gleich wieder das open
-Attribut hinzufügt. Außerdem werden deine if
-Bedingungen nicht das tun, was du vermutest. Es gibt in JavaScript einen Unterschied zwischen HTML-Attributen und DOM-Properties, der hier eine Rolle spielt Und der Vergleich mit ==
verschlimmert die Sache noch. Bastle mal ein reduziertes Beispiel mit nur einem <details>
-Element. Und anschließend verfeinere das Beispiel, achte auf den Unterschied zwischen Attribut- und Properties, vermeide this
im Event-Handler und benutze nur den strikten Vergleich ===
. Dann solltest du schnell darauf kommen, was da schief läuft.