JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/cupertino/jquery-ui.css">
<div id=body></div>
<div id=dialog></div>
CSS
#dialog {
max-height:400px;
overflow:scroll;
color: green;
font-weight: bold;
}
.log {
color: red;
font-weight: bold;
}
JavaScript
for(var i = 1; i <= 5; i++)
{
$("#body").append('<h3>report '+i+'</h3>');
}
$("h3").click(function(){
if($("#dialog").html())
{
$("#dialog").html('').dialog("destroy");
}
else
{
for(var i = 0; i < 200; i++)
{
$("#dialog").append('<div class=log>log line: '+i+'</div>');
}
$("#dialog").dialog();
}
});