title: Preserving white spaces before while transfering text from textarea to table cell
body: <p>I need your help,</p>
  
  <p>How can the regex/replace coding be amended such that I would not only be able to also preserve the line breaks after the text but to also preserve the extra white spaces in front of the text, in between text and after the text.</p>
  
  <p>I've attached a pic of what the result is currently. The expected end result should mirror that of the first text area</p>
  
  <p><img src="https://i.stack.imgur.com/eq5a7.png" alt="enter image description here"></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  
  &lt;html&gt;
  
  &lt;head&gt;
  
  &lt;script type="text/javascript"&gt;
  
  function test() {
  
  //textarea to table cell
  var x = document.getElementById('txt1').value.replace(/\r?\n/g,'&lt;br&gt;')
  
  //table cell to textarea
  
  document.getElementById("table1").children[0].children[0].innerHTML = x
  
  var y = document.getElementById("table1").children[0].children[0].innerHTML
  
  //some processing first to replace the &lt;br&gt;'s before the final output
  
  y = y.replace(/\s*&lt;br\s*\/?&gt;\s*/g, '\n')
  
  document.getElementById("txt2").value = y
  
  }
  
  
  &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;textarea style="height: 200px;" id="txt1"&gt;&lt;/textarea&gt;
  &lt;br&gt;
  &lt;table id="table1"&gt;&lt;tr&gt;&lt;td&gt;cell data1&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
  &lt;br&gt;
  &lt;input type="button" value="test it" onclick="test()"&gt;
  &lt;br&gt;
  &lt;textarea style="height: 200px;" id="txt2"&gt;&lt;/textarea&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>