JSFiddle - React, Tailwind, and code Playground

HTML

<div id='bE1' style='display: inline-block; height: 120px;'>
  <div id="link-insert1" class="white_content">Legg til en lenke ved ny sekvens.
    <br>
    <br>
    <div id="small">Tittel som vises</div>
    <input id="url_title1" name="url_title" type="text" class="input-field-save">
    <br>
    <div id="small">Nettadressen</div>
    <input id="url_content1" name="url-content" type="text" class="input-field-save">
    <br>
    <br>
    <button type="button" id="lcloseinsert1">Sett inn</button>
    eller
    <button type="button" id="lclosedecline1">Lukk</button>
  </div>
  <div id="link-fade1" class="black_overlay"></div>
  <td>
    <button type="button" id="lsaveinsert1">Btn</button>
  </td>

  <div id="div-new-wrap" style="vertical-align: top; display: inline-block;">
    <div id="div_new_1" tabindex="100" style="outline: none; display: inline-block; padding: 3px; border: 1px solid #aeaeae; font-size: 14px; word-wrap: break-word; width: 236px; min-height: 85px; height: auto;" contenteditable="true" data-text="Test"></div>
  </div>
</div>

CSS

#link-insert1 {
  display: none;
}

JavaScript

lsaveinsert1.addEventListener("click", lsaveRangePosition1);
lclosedecline1.addEventListener("click", lrestoreRangePosition1);
lcloseinsert1.addEventListener("click", lrestoreRangePositionInsert1);

// ******************
// LINK INSERT
// ******************
function openPopupLink1() {
  document.getElementById('link-insert1').style.display = 'block';
  document.getElementById('link-fade1').style.display = 'block';
}

function closePopupLink1() {
  document.getElementById('link-insert1').style.display = 'none';
  document.getElementById('link-fade1').style.display = 'none';
}

function lsaveRangePosition1() {
  var range = window.getSelection().getRangeAt(0);
  var sC = range.startContainer,
    eC = range.endContainer;

  A = [];
  while (sC !== bE1) {
    A.push(getNodeIndex1(sC));
    sC = sC.parentNode
  }
  B = [];
  while (eC !== bE1) {
    B.push(getNodeIndex1(eC));
    eC = eC.parentNode
  }

  window.rp = {
    "sC": A,
    "sO": range.startOffset,
    "eC": B,
    "eO": range.endOffset
  };

  openPopupLink1();
}

function lrestoreRangePosition1() {
  closePopupLink1();
  div_new_1.focus();
  var sel = window.getSelection(),
    range = sel.getRangeAt(0);
  var x, C, sC = bE1,
    eC = bE1;

  C = rp.sC;
  x = C.length;
  while (x--) sC = sC.childNodes[C[x]];
  C = rp.eC;
  x = C.length;
  while (x--) eC = eC.childNodes[C[x]];

  range.setStart(sC, rp.sO);
  range.setEnd(eC, rp.eO);
  sel.removeAllRanges();
  sel.addRange(range)
}

function lrestoreRangePositionInsert1() {
  var newText1 = document.getElementById('url_title1').value;
  var newText2 = document.getElementById('url_content1').value;

  var pasteText = "<a href='" + newText2 + "'>" + newText1 + "</a>";
  closePopupLink1();

  div_new_1.focus();
  console.log(document.activeElement)
  var sel = window.getSelection(),
    range = sel.getRangeAt(0);
  var x, C, sC = bE1,
    eC = bE1;

  C = rp.sC;
  x = C.length;
  while (x--) sC = sC.childNodes[C[x]];
  C = rp.eC;
  x = C.length;
  while...