JSFiddle - React, Tailwind, and code Playground

by Hidayat Rifan

HTML

<span class='roboto'>this is font roboto</span>
<br />
<span class='ropa-sans'>this is font ropa sans</span>
<br />
<span class='oswald'>this is font oswald</span>

CSS

body {
    color: #000;
    background: none repeat scroll 0% 0% #F2F2F2;
    font-size:25px
}
.roboto {
    font-family:"roboto", "Segoe UI", Arial, Tahoma, sans-serif;
    margin:0 0 10px
}
.ropa-sans {
    font-family:"ropa sans", "Segoe UI", Arial, Tahoma, sans-serif;
    margin:0 0 10px
}
.oswald {
    font-family:"oswald";
    margin:0 0 10px
}

JavaScript

function async(type, url, id, callback) {
    var a;
    if (type == "js") {
        a = document.createElement("script");
        a.id = id;
        a.src = url
    }
    if (type == "css") {
        a = document.createElement("link");
        a.rel = "stylesheet";
        a.href = url
    }

    a.onload = function () {
        if (typeof callback == "function") {
            callback()
        }
        callback = null
    };
    a.onreadystatechange = function () {
        if (s.readyState == 4 || s.readyState == "complete") {
            if (typeof callback == "function") {
                callback()
            }
            callback = null
        }
    };
    document.getElementsByTagName("head")[0].appendChild(a)
}

async("js", "http://obesitystrike.blogspot.com/feeds/comments/default?alt=json-in-script&orderby=published&max-results=20&callback=rc", "rc", function () {
    alert('Loaded!')
})
async("css", "http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700|Ropa+Sans|Oswald")