JSFiddle - React, Tailwind, and code Playground
HTML
<iframe id="editor" style="border: none; position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%"></iframe>
JavaScript
var editor = $('#editor').contents().find('body');
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation);
if (mutation.type === 'characterData') {
console.log('Tag name is: ' + mutation.target.parentNode.tagName);
}
});
});
// Configuration of the observer.
var config = {
attributes: true,
childList: true,
characterData: true,
subtree: true
};
observer.observe(editor[0], config);
$('#editor').contents().prop('designMode', 'on');
editor.append("<p>Test <b>bold</b> text</p>");