JSFiddle - React, Tailwind, and code Playground

HTML

<iframe id="source" src="http://fiddle.jshell.net"></iframe>

CSS

#source{
    border: 1px solid red;
    color:#000;
}

/*this css class is not visible in the iframe*/
.hover{
    color:red;
}
.htmlzoom{background:#000;}

JavaScript

var $c = $('#source').contents();

//clone all styles from this document into the iframe
$c.find('head').append($('style, link[rel=stylesheet]').clone());

$c.find('body').prepend('<b>This is a test</b><br><b>Click here</b>');

$c.delegate('b', 'hover', function() {
    $(this).toggleClass('hover');
});

$c.delegate('b', 'click', function() {
    alert('You clicked on:' + $(this).text());
});
$c.find('body').addClass("htmlzoom")