JSFiddle - React, Tailwind, and code Playground

HTML

<form>
  <section>
    <h2><span>Arbeitsplatz </span><button type="button" name="remove">Entfernen</button></h2>
    <label for="uberschrift"><span>Überschrift:</span><input type="text" name="uberschrift" size="80"></label>
    <label for="inhalt"><span>Text:</span><input type="text" name="inhalt" size="80"></label>
    
    <label>Anzahl der hochzuladenen Bilder:
    <select id="dropdown" name="top10" onchange="addinputFields()">
      <option value="">Bitte wählen</option>
      <option value="1"> 1 Bild</option>
      <option value="2"> 2 Bilder</option>
      <option value="3"> 3 Bilder</option>
      <option value="4"> 4 Bilder</option>
      <option value="5"> 5 Bilder</option>
      <option value="6"> 6 Bilder</option>
      <option value="7"> 7 Bilder</option>
      <option value="8"> 8 Bilder</option>
      <option value="9"> 9 Bilder</option>
      <option value="10">10 Bilder</option>
      </select>
    </label>
    
    <div id="container"></div>
    <label for="bild"><span>Bild:</span><input name="bild" type="file"></label>
    
    
    <label for="video"><span>Video:</span><input name="video" type="file"></label>
    <label for="schluss"><span>Schlusstext:</span><input name="schluss" type="text" size="80"></label>

  </section>
</form>
<button id="newPlace" type="button">Neuer Arbeitsplatz</button>
  <button id="enter" type="submit">Daten abschicken</button>

CSS

form { counter-reset: plaetze 0; }
h2 span:before { content: counter(plaetze) '. '; counter-increment: plaetze 1; display:inline; }

label { display: block; margin-bottom: 1em; }
label span { display: inline-block; width: 6em; }
label input[type=text] { display: inline-block; }

button[name=remove] { margin-left: 2em; vertical-align: top; line-height: 1.5em; display:none; }
form section:not(:only-of-type) button[name=remove] { display:inline; }



#newPlace{
  border-radius: 0.5em;
  background-color: greenyellow;
font-weight: bold;
}
#enter{
  margin-left: 347px;
  border-radius: 0.5em;
  background-color: dodgerblue;
  font-weight: bold;
}

#container{
  display: inline-block; margin-bottom: 1em;
}

JavaScript

document.addEventListener("DOMContentLoaded", function() {
   var form = document.querySelector("form");
   document.getElementById("newPlace").addEventListener("click", cloneSection);
	 form.addEventListener("click", function(evt) {
      if (evt.target.name == "remove") form.removeChild(sectionFor(evt.target));
   });
   form.addEventListener("input", function(evt) {
      if (evt.target.name == "uberschrift") updateHeader(sectionFor(evt.target), evt.target.value);
   });

   function cloneSection(evt) {
      var target = form.querySelector("section:first-child").cloneNode(true);
      form.appendChild(target);
      updateHeader(target, null);
      var textFields = target.querySelectorAll("input[type=text]");
      for(j=0; j < textFields.length; ++j)
         textFields[j].value = '';
   }
	 function updateHeader(section, hdrValue) {
      var header = section && section.querySelector("h2 span");
      if (header) {
        header.innerText = "Arbeitsplatz - " +hdrValue || "Arbeitsplatz "; 
    
      }
   }
   function sectionFor(control) {
      while (control && control.tagName.toLowerCase() != "section")
         control = control.parentNode;
      return control;
   }
});
  
    function addinputFields(){
    var number = document.getElementById("dropdown").value;

    for (i=0;i<number;i++){

        var input = document.createElement("input");
        input.type = "file";
        container.appendChild(input);
        container.appendChild(document.createElement("br"));
    }
}