Zu kompliziert?

[Gunnar Bittersmann]

@@Jnnbo

um die Buttons hervorzuheben füge ich beim Klick eine CSS Class hinzu, wenn ich auf den zweiten Button klicke, wird diese beim ersten und beim dritten Button wieder entfernt

1. Es gibt keine CSS-Klassen.

2. Es gibt die Pseudoklasse :active, die ein Button dann hat, wenn er geclickt ist.

Geht dieses auch einfacher, denke ich wieder viel zu kompliziert?

Ja, das tust du. Zur Auwahl einer aus mehrern Möglichkeiten gibt es in HTML native Elemente: eine Gruppe von Radiobuttons und select/option (wobei erstere Vorteile haben).

Diese Funktionalität mit anderen Elementen (button) und JavaScript nachbauen zu wollen, ist Unsinn. Das führt dazu, dass die Seite nicht mehr barrierefrei bedienbar ist, TL;DR also nicht bedienbar ist. Man müsste enormen Aufwand betreiben, um die Barrierefreiheit wieder herzustellen.

Besser ist es, immer die passenden HTML-Elemente zu verwenden. Die lassen sich mit CSS stylen, bspw. die Radiobuttons selbst verstecken und die Labels wie Buttons aussehen zu lassen. (Beispiel)

Und ist es möglich ein Button komplett zu "entklicken" dass der Wert wieder gelöscht wird, wenn ich ein zweites mal auf den Button klicke?

Auch das Problem erfreut sich bei Verwendung der richtigen HTML-Elemente seiner Nichtexistenz.

LLAP