ContentEditable 2 NewLine

HTML

Add new line to me:
<div 
  id="ss"
  class="plain"
  role="textbox"
  contenteditable
  oninput="update()">hello

world, two new lines!!
</div>
<br>Direct inner text copy, every new line added above I get two:
<div id="d1" class="plain"></div>
<br>Inner html:
<div id="d2" class="plain"></div>

CSS

.plain {
    display: block;
    font-family: monospace;
    white-space: pre;
    width: 100%;
    border: 1px solid;
    overflow: auto;
}

JavaScript

function update() {
	document.getElementById('d1').innerText = document.getElementById('ss').innerText;
  document.getElementById('d2').innerText = document.getElementById('ss').innerHTML;
}
update();