I’m trying to achieve the following on my website: when a button is clicked, it becomes active, its value is sent to an input field, and if the value in the input field is changed manually, the button’s active state should be removed.

Here’s an example of the buttons:

I have two variations of functions, but neither works completely, and I can’t combine them.

In the first variation, the issue is that the active state is not removed from the buttons when the input field is manually edited.

In the second variation, the problem is that buttons can’t be toggled repeatedly. It only works once. After the second click (on a different button), that second button doesn’t become active.