JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.githubusercontent.com/SteveSanderson/knockout-es5/master/dist/knockout-es5.min.js"></script>
<div contenteditable="true" data-bind="htmlValue: data.name"></div>
<input data-bind="value: data.name, valueUpdate: 'afterkeydown'"></input>
<input data-bind="value: data.name, valueUpdate: 'afterkeydown'"></input>

JavaScript

ko.bindingHandlers.htmlValue = {
    init: function(element, valueAccessor, allBindingsAccessor, context) {
      var handler;
      handler = function() {
        var value, writable;
        writable = valueAccessor();
        console.log(allBindingsAccessor());
        value = element.innerHTML;
        return allBindingsAccessor().htmlValue = value;
      };
      ko.utils.registerEventHandler(element, "keyup", handler);
      ko.utils.registerEventHandler(document, "click", handler);
    },
    update: function(element, valueAccessor) {
      var value;
      value = valueAccessor();
      if (element.innerHTML !== value) {
        element.innerHTML = value;
      }
    }
  };

var data = {
    name: 'blah'
};

ko.track(data);
ko.applyBindings({data: data});