JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.4.1/tinymce.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.4.1/jquery.tinymce.min.js"></script>
<h1>TinyMCE Quick Start Guide</h1>
<form method="post">
    Disable: <input type="checkbox" id="nonAdmin">
    <textarea id="rte">Hello, World!</textarea>
</form>

JavaScript

$(function () {
  $('#nonAdmin').on('change', function(e) {
    if (this.checked) {
      tinyMCE.get('rte').setMode('readonly');
    } else {
      tinyMCE.get('rte').setMode('code');
    }
    //tinyMCE.get('rte').getBody().setAttribute('contenteditable', !this.checked);
  })
  tinymce.init({
    selector: '#rte',
    toolbar: 'bold italic underline',
    height: '200px',
    width: '420px',
    elementpath: false,
    menubar: false,
    content_style: "div {border: 50px solid red;}",

    setup: function (ed) {
      ed.on('init', function () {
        this.getDoc().body.style.fontSize = '16px';
        this.getDoc().body.style.fontFamily = 'Helvetica';
        //disables editing for non admins
        if ($('#nonAdmin').prop('checked')) {
          this.setMode('readonly');
        }

      });
    }
  });
});