JSFiddle - React, Tailwind, and code Playground

HTML

<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>

CSS

.iframe{height:220px;width:390px;}

JavaScript

var doc,$body,cur='';
var txt;
txt = Array(
						'<style>body{background-color:grey} h1{background-color:red;font-weight:900}</style><h1>Cool!!! this is text for</h1><p>First Iframe</p>',
            '<body>153135153<style>body{background-color:pink}h1{background-color:green;font-weight:200}</style><h1>Cool This is Text for</h1><p> second Iframe</body>',
            '<style>body{background-color:yellow}h1{font-weight:400}</style><h1>Cool..... This is text FOR : </h1> <div>3rd Iframe</div>',
            '<style>body{background-color:blue} h1{font-weight:400}</style><h1>Cool This is text for Fourth iframe</h1>'
            );
$('.iframe').each(function(index,value){
    doc = this.contentWindow.document;
		$body = $('body',doc);
		$body.html(txt[index]);
});