JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://plugins.jquery.com/files/jquery.field_selection.js__0.txt"></script>
<script type="text/javascript" src="http://plugins.jquery.com/files/jquery.field_selection.js__0.txt"></script>
<form id="myform">
    <textarea id="input" rows="10" cols="40"></textarea>
    <textarea id="fixed" rows="10" cols="40"></textarea>
</form>

CSS

#myform textarea {
    border: 1px solid #000;
    position: absolute;
}
#myform #input {
    color: #AAA;
    z-index: -1;
}
#myform #fixed {
    background: transparent;
    color: #000;
    z-index: 1;
}

JavaScript

$("#fixed").focus(function() {
    $("#input").focus();
});
$("#input").keyup(function() {
    caretPos = $("#input").getSelection().start;
    var start, end;
    var myString = $("#input").val();
    for (start = caretPos; start >= 0 && myString[start] != "\n"; --start);
    for (end = caretPos; end < myString.length && myString[end] != "\n"; ++end);
    line = myString.substring(start+1, end);
    var reg = new RegExp("^(?!" + line + ").*$", 'gm');
    $("#fixed").val($("#input").val().replace(reg, ""));
});