title: How to make append child write html in seperate line instead of one line?
body: <p>I have a button that appends an input element. Whenever I do this the innerHTML return</p>
  
  <pre><code>&lt;input&gt;&lt;input&gt;&lt;input&gt;
  </code></pre>
  
  <p>I'd like it to append each new input on a new line as such</p>
  
  <pre><code>&lt;input&gt;
  &lt;input&gt;
  &lt;input&gt;
  </code></pre>
  
  <p>I've tried creating a text node = " "
  I've also tried looking for the symbol for the return key so i could append this before the input element but I can't seem to find it</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;head&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;form id="formID"&gt;
      &lt;input type="number"&gt;
      &lt;input type="number"&gt;
      &lt;input type="button" id="addButton" value="Add Element"&gt;
    &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>let addButton = document.getElementById("addButton");
  let form = document.getElementById("formID");
  addButton.onclick = function test() {
    let input = document.createElement("input");
    form.appendChild(input);
  };
  </code></pre>
  
  <p>I'm want an innerHTML similar to the below
  
  
  instead of
  </p>