What to do with the repeated execution of a js function that is a property of an object?

Question

css

Greetings! I'm making a modal with html and js. It has a custom select for css. But the culprits of the party are not them. The culprit is a custom prompt that I'm trying to implement with my crooked hands through an object.

Instruction

1. You need to click on the "show" button.
2. You need to click on the "Select" button.
3. You need to click on the "OK" button.
4. It is necessary to close the alert(s).
5. Repeat everything from point 1.

After doing everything according to the instructions, you will notice that with each, one might say, iteration, the number of alerts increases by 1. That is, each time the function is executed 1 more time. Although it should always be performed only 1 time. I'm not strong in js, help me figure out the lawlessness, please.

Link to the source

Ps using the latest version of jQuery.

Answer 1

because it is not necessary to hang up an event listener every time the button is pressed.
where do you even get this, it doesn't work that way.
https://jsfiddle.net/7qo3fm14/