ckeditor no knockout

by JonNorman

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/attrchange/2.0.1/attrchange.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ckeditor/4.11.1/ckeditor.js"></script>
<div id="parameterLines" class="tab-pane fade in active">
  <table style="border: 1px solid">
    <thead>
      <tr class="side-margin">
        <th width="150px">Quality Parameter</th>
        <th width="150px">Method of Analysis</th>
        <th width="180px">Conditions of Analysis</th>
        <th width="200px">Specification Requirement</th>
        <th width="50px">UoM</th>
        <th width="40px">Tol</th>
        <th width="50px">UoT</th>
      </tr>
    </thead>
    <tbody></tbody>
  </table>
</div>
<button id="reload">reload</button><button id="readonlyToggle">set to read</button>
<div id="debug">
</div>

CSS

th,
td {
  border: 1px solid
}

JavaScript

$(document).ready(function() {
  $("#reload").click(function() {
    display();
  }).click();
  $("#readonlyToggle").click(function() {
    read = $(this).text() == "set to read";
    if (read) {
      $(".editable").removeAttr("contenteditable");
      $.each(CKEDITOR.instances, function(i, editor) {
        editor.destroy();
      });
    } else {
      $(".editable").attr("contenteditable", "true");
      setupCkEditor();
    }
    $(this).text(read ? "set to write" : "set to read");
  });
});

function setupCkEditor() {
  $(".editable").ckeditor(/*function() {
    //$("#debug").text((Date.now() - timeNow) + "ms")
  },*/ {
    customConfig: '',
    enterMode: 'CKEDITOR.ENTER_BR',
    allowedContent: 'br sub sup',
    extraPlugins: 'carbosynthSpecCofaEditor',
    toolbar_Basic: [
      ['carbosynthValues']
    ],
    toolbar: 'Basic'
  }).parent().click(function() {
    editorElement = $(this).children().first();
    if (editorElement) {
      editorId = editorElement.attr("id");
      if (editorId) {
        editor = CKEDITOR.instances[editorId];
        if (editor && !editor.readOnly) {
          editor.focus();
        }
      }
    }
  });
}

function display() {
  var timeNow = Date.now();
  CKEDITOR.disableAutoInline = true;
  $.each(CKEDITOR.instances, function(i, ob) {
    ob.destroy();
  });
  $("#parameterLines tbody").html("");
  $.each(specLines, function(i, specLine) {
    $row = $("<tr></tr>");
    $col = $("<td></td>").attr("valign", "top").append($("<p></p>").css({
      "display": "inline-block",
      "margin": "0"
    }).attr("id", "qp_" + i).attr("contenteditable", "true").addClass("vals4qualityParameters").addClass("editable").html(specLine.QualityParameter));
    $row.append($col);
    $col = $("<td></td>").attr("valign", "top").append($("<p></p>").css({
      "display": "inline-block",
      "margin": "0"
    }).attr("id", "moa_" + i).attr("contenteditable",...