Javascript add buttons dynamicly with special id

I want to add Buttons to my div and want to be able to go to a Special formpage where every button has its own diffrent Group form.

my code Looks like this right now.

function buttonsErzeugen() {
    for (var i = 0; i <= 1; ++i) {
        var button = document.createElement("button");
        var beschriftung = document.createTextNode("Gruppe"+i);
        button.appendChild(beschriftung);
        var Bereich = document.getElementById("Bereich");
        Bereich.appendChild(button);
        button.setAttribute("onClick", "eventHandlerForButtons('"+i+"');");
    }
}

<button onClick="buttonsErzeugen();">Erzeuge Buttons</button>
<div id="Bereich"></div>

function eventHandlerForButtons(alertText) {
    alert(alertText);
}

I have 2 Problems. First is that when i click the button i create two Buttons, when i click it again i create again 2 Buttons with the same text. I only want to create one button by one click and the next click should be a new button with a new text and ID.

After that I want to link with the button to a next page where the Group is which one user created. If i click another button I want to link to the same form but diffrent data of the Group

Has anyone a hint for me??