Javascript-Buttons zur Laufzeit erstellen, Suche eine elegantere Lösung

[MarlemEntwickler]

Hallo,
ich erstelle Javascript-Buttons zur Laufzeit.
Mir fehlt in Javascript noch Programmiererfahrung. Folgender Code funktioniert, ist aber sehr viel zum Tippen:

//Schalter Mein Name ist
    const cschalterMeinNameist = document.createElement("button");  
    cschalterMeinNameist.innerText = "Mein Name ist";
    cschalterMeinNameist.style.width = '30%';
    cschalterMeinNameist.style.height = '1%';
    cschalterMeinNameist.addEventListener("click", function(event) {
    var vTextArea = document.getElementById('idtextzumsprechen');        
    vTextArea.value = "Mein Name ist ";
    });
    var vWebseiteBereich = document.getElementById("erstellteschalter");
    vWebseiteBereich.appendChild(cschalterMeinNameist);


    //Meine Telefonnummer ist ...
    const cschalterMeineTelefonnummer = document.createElement("button");  
    cschalterMeineTelefonnummer.innerText = "Meine Telefonnummer ist";
    cschalterMeineTelefonnummer.style.width = '30%';
    cschalterMeineTelefonnummer.style.height = '1%';
    cschalterMeineTelefonnummer.addEventListener("click", function(event) {
    var vTextArea = document.getElementById('idtextzumsprechen');        
    vTextArea.value = "Meine Telefonnummer ist "
    });
    var vWebseiteBereich = document.getElementById("erstellteschalter")
    vWebseiteBereich.appendChild(cschalterMeineTelefonnummer)

Frage:
Wie kann ich das Erstellen von Javascripts-Buttons zur Laufzeit eleganter coden?

[Arne Drews]

Ich weiß ja nicht, wie häufig Du das verwendest, aber es könnte sich schon lohnen eine Klasse oder Erweiterung zu schreiben, mit der das dann so in etwa möglich wäre:

var button = new MyElements("button", {
    innerText: 'Meine Schaltfläche'
    , width: '30%'
    , height: '1%'
    , eventHandler: {
        click: function(e) {
            // do something
        }
    }
});

body.appendChild(button);

Keine Ahnung, ob Dir das vorschwebt...