I have a simple HTML page which is loading content (from a database) into a TinyMCE v5 textarea upon initialisation. I'd like to switch the default text color or highlight after the content has loaded so that any changes the user makes are discernable from the original text. If possible, I'd like to lock the option to change further formatting. The idea is basically a poor-man's track changes.

My current code looks like this:

<script>
  var txtcontent = '{!! str_replace(["\r", "\n"], "", $examQuestionInstance->question) !!}';
  tinymce.init({
    selector: 'textarea#answer_given_text',
    toolbar: 'undo redo | forecolor strikethrough',
    custom_colors: false,
    color_map: ['FF0000', 'Red', '000000', 'Black',],
    content_style: '.correction { color: red; }',
    statusbar: false,
    menubar: false,
    setup: function (editor) {
      editor.on('init', function (e) {
        editor.setContent(txtcontent);
      });
      editor.on('change', function (e) {
        @this.set('examQuestionInstance.answer_given_text', editor.getContent());
      });
    }
  });
</script>

I'd really appreciate thoughts and ideas on how to best handle this. Thanks!