El detalle está en el val y el html, también puedes tener dos funciones para poder lograr escribir lo mismo en los dos elementos.
$(document).ready(function(){
var EditHTML = $("#detail");
$("#editor").html(EditHTML.val());
});
$(function() {
var EditHTML = $("#detail");
EditHTML.on("keyup", function(e) {
$("#editor").html(EditHTML.val());
});
});
$(function() {
var EditHTML = $("#editor");
EditHTML.on("keyup", function(e) {
$("#detail").val(EditHTML.html());
});
});
#editor {
resize: vertical;
overflow: auto;
border: 1px solid silver;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
min-height: 100px;
padding: 1em;
background-color: white;
width: 100%;
color: #333;
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="detail">Esta información debe pasar al div editable y viceversa, es decir todo cambio que se realicen tanto en el textarea con el div editable en ambos se debe mostrar </textarea>
<div id="editor" contenteditable></div>