# Html Button mit JavaScript ausführen



## janS (24. Jul 2018)

Hallo Leute,
ich hätte da nochmal ein Anliegen, Ich habe mit Bootstrap vier Buttons erstellt und möchte diese nun nicht viermal da hinschreiben sondern mit JavaScript 4 mal ausführen lassen.
Ist das do ertsmal möglich oder ist die idee kompletter Schwachsinn?
Hier erstmal wie ich das vorher gelöst habe:

```
<button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1"><p id="xsmall1"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-2"><p id="xsmall2"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1"><p id="xsmall3"></p></button>
        <button type="button" id="Test" class="btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-2"><p id="xsmall4"></p></button>
```

Und jetzt wie meine Idee ist mit nur einem button:
HTML:

```
<button type="button" id="btnxs" class="btn col-xs-8 col-xs-offset-2 "></button>
```

JavaScript:

```
for(var i = 0; i < 4; i++){
        document.getElementById('btnxs').innerHTML = "TestTestTest";
    }
```

Ist das so möglich oder vertue ich mich da komplett.
Danke für die Hilfe schonmal im vorraus.
MfG Jan


----------



## mrBrown (24. Jul 2018)

Das ist Javascript, nicht Java  Ich habs mal ins passende Forum verschoben...


----------



## mrBrown (24. Jul 2018)

janS hat gesagt.:


> Ich habe mit Bootstrap vier Buttons erstellt und möchte diese nun nicht viermal da hinschreiben sondern mit JavaScript 4 mal ausführen lassen.



Kannst du noch mal erklären, was du damit überhaupt meinst?


----------



## janS (24. Jul 2018)

Tut mir leid mit dem falschen Forum hab ich zuspät gemerkt.

Ich habe vier Buttons erstellt so wie im ersten Code. Jetzt möchte ich das ich das selbe Ergebnis nur mit anderem Code erziele  und am besten mit einer Schleife in JS, so das diese Schleife jedes mal den einen erstellten Button neu aufruft und anzeigt.


----------



## mihe7 (24. Jul 2018)

```
<!DOCTYPE html>
...
<body>
<div id="buttons"></div>
</body>
```


```
function createButton(text) {
    var btn = document.createElement("button");
    btn.className = "btn col-xs-8 col-xs-offset-2 col-sm-4 col-sm-offset-1";
    btn.innerText = text;
    return btn;
}

function addButtons() {
    var container = document.getElementById("buttons");
    for (var i = 0; i < 4; i++) {
        container.appendChild(createButton("Test" + (i+1)));
    }
}
```

So ähnlich sollte das funktionieren.


----------



## janS (24. Jul 2018)

Danke für die schnelle Anwort. Ich habe selber auch noch weiter gegoogelt und auch append gefunden und mich damit probiert. Funktioniert jetzt einwandfrei.


----------

