JSFiddle - React, Tailwind, and code Playground

by radu

HTML

<div id="starred-posts">
                                <div class="votesummary">
                                    <ul class="collapsible">

        <li id="summary_4857645" data-time="1344452431" style="display: block; ">
            <span title="Add or remove your star" class="vote-count-container sidebar-vote stars ">
                <span class="img vote"></span>
            </span>
            <a href="https://twitter.com/quackingduck/status/233248946863099905" rel="nofollow">twitter.com/quackingduck/status/233248946863099905</a>
            - <a class="permalink" href="/transcript/message/4857645#4857645"><span title="2012-08-08 19:00:31Z" class="relativetime">49m ago</span></a>
            by <a href="/users/419970/raynos" title="Raynos">Raynos</a>
                <span title="More options..." class="quick-unstar">▼</span>
        </li>
        <li id="summary_4857546" data-time="1344452179" style="display: none; ">
            <span title="Add or remove your star" class="vote-count-container sidebar-vote stars ">
                <span class="img vote"></span>
            </span>
            there is nothing JSON about JSONP, it's self-inflicted XSS that runs arbitrary javascript on your page
            - <a class="permalink" href="/transcript/message/4857546#4857546"><span title="2012-08-08 18:56:19Z" class="relativetime">53m ago</span></a>
            by <a href="/users/995876/esailija" title="Esailija">Esailija</a>
                <span title="More options..." class="quick-unstar">▼</span>
        </li>
        <li id="summary_4856476" data-time="1344449243" style="display: none; ">
            <span title="Add or remove your star" class="vote-count-container sidebar-vote stars ">
                <span class="img vote"></span>
                    <span class="times">2</span>
            </span>
            i was watching PORN :-|
            - <a class="permalink" href="/transcript/message/4856476#4856476"><span title="2012-08-08 18:07:23Z"...

JavaScript

var jsonp = {};

(function(jsonp, d) {
    var request = 0,
        callbacks = {};

    // takes callback object of the form:
    // { 
    //        name : 'customCallback',
    //        fun : myCallbackFunction
    // }
    // this allows for callbacks with names other than the generic 'callback' or 'jsonp'
    jsonp.get = function(url, data, callback) {
        var head = d.getElementsByTagName('head')[0],
            script = d.createElement('script');

        data[callback.name] = 'jsonp.callbacks.request_' + request;

        callbacks['request_' + request] = function(data) {
            head.removeChild(script);
            delete callbacks['request_' + request];
            callback.fun(data);
        };

        var encodeParams = function(data) {
            var queryString = [];
            for (var item in data) {
                // only push to array if non-null
                if (item !== null && data.hasOwnProperty(item)) {
                    queryString.push(encodeURIComponent(item) + '=' + encodeURIComponent(data[item]));
                }
            }
            return queryString.join('&');
        }

        var isEmpty = function(obj) {
            // check if there is built in property
            if (Object.keys) return Object.keys(obj).length === 0;

            for (var prop in obj) {
                if (obj.hasOwnProperty(prop)) return false;
            }

            return true;
        };

        request++;

        if (!isEmpty(data)) url += encodeParams(data);

        script.type = 'text/javascript';
        script.async = true;
        script.src = url;

        head.appendChild(script);
    };

    jsonp.callbacks = callbacks;

}(window.jsonp = jsonp || {}, document));

jsonp.get('http://analytics.altruad.com/sharecount.php?', {
    twitter : '',
    url: 'http://google.com'
}, {
    name: 'callback',
    fun: getCounts
});

function getCounts(data) {
    console.log(data);
}