JSFiddle - React, Tailwind, and code Playground

by godhong

HTML

<!DOCTYPE html>
<!--start 01uberheader-->
<!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">-->
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title> &uuml;bertool </title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <style type="text/css" media="screen">
	<!--
  	@import url(/stylesheets/style_eco.css);
	-->
  </style>

  <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-29644386-1']);
    _gaq.push(['_trackPageview']);

    (function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
  </script>
<!-- Import jQuery library -->
  <script src="/stylesheets/jquery-1.7.2.js" type="text/javascript"></script>
<!-- import Javascripts -->
  <script src="/stylesheets/scripts.js" type="text/javascript"></script>
<!-- Browser FAVICON -->
  <LINK REL="SHORTCUT ICON" HREF="http://www.ubertool.org/images/favicon/eco/favicon.ico" />

</head>

<body>

<!-- Main Container Div -->
<div id="container">

<!-- Spacer -->
<div class="spacer"></div>

<!-- Ubertool banner -->
<div id="banner">
  <a href="/index.html" id="banner_l">&uuml;bertool: web applications for ecological risk assessment (beta version)</a>
  <a href="about.html" id="banner_r">about</a>
</div>

<!-- Spacer -->
<div class="spacer"></div>

<!-- Header -->
<div id="topheader_pic">
  <a href="/eco_index.html"><img src="/images/species/waterfrog.png" alt="Frog"></a>
</div>
<div id="topheader_p">  
  <p>Cloud-based environmental models for evaluating pesticide risks to ecosystems.</p>
</div>

<!--end 01uberheader-->
<!--start 02uberintroblock_wmodellinks-->

<!-- "Click" Menus -->
  <script type="text/javascript">
...

JavaScript

var jq_html = $('<div />').append($("div.articles").children('table[class*=out_]:not(div#chart1,table:hidden)').clone()).html();
var n_plot=$('div[id^="chartt"]').size()
console.log(jq_html)
console.log(n_plot)

i=1;
var imgData = [];
while(i <= n_plot){
    imgData.push($('#chartt'+i).jqplotToImageStr({}));
    i=i+1    
}
imgData_json = JSON.stringify(imgData)

console.log(imgData_json)