JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/SteveSanderson/knockout/raw/master/build/output/knockout-latest.debug.js"></script>
<script src="https://github.com/SteveSanderson/knockout.mapping/raw/master/build/output/knockout.mapping-latest.debug.js"></script>
<script src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.js"></script>
<p data-bind="text:name"></p>
<input type="text" data-bind="value: nameConverted "></input>

JavaScript

var viewModel = {
    name: ko.observable('Hello &amp; Goodbye3')
};

viewModel.nameConverted = ko.dependentObservable({
    read: function() {
        return htmlDecode(this.name());
    },
    write: function(value) {
        this.name(htmlEncode(value));
    },
    owner: viewModel
});

function htmlEncode(value){ 
  return $('<div/>').text(value).html(); 
} 
 
function htmlDecode(value){ 
  return $('<div/>').html(value).text(); 
} 

ko.applyBindings(viewModel);