JSFiddle - React, Tailwind, and code Playground

by Alma Grace

HTML

<header>
    
<h1 class="logo"><a  href="/" title="BoF &#8211; The Business of Fashion" rel="home"><img src="http://cdn.businessoffashion.com/wp-content/uploads/2013/01/bof_logo.png" alt="BoF &#8211; The Business of Fashion"></a></h1>

    <nav class="nav" role="navigation">
        	<h1 class="menu-title visuallyhidden">Navigation</h1>

        <ul id="menu-channel-navigation" class="menu">
            <li class="category-daily-digest menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.businessoffashion.com/daily-digest/2014/03/29" title="Daily digest">Daily Digest</a>

            </li>
            <li id="menu-item-40438" class="category-news-analysis menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-40438"><a href="http://www.businessoffashion.com/category/news-analysis">News &#038; Analysis</a>

                <ul class="sub-menu">
                    <li id="menu-item-42282" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-42282"><a href="http://www.businessoffashion.com/category/news-analysis/bof-exclusive">BoF Exclusive</a>

                    </li>
                    <li id="menu-item-43440" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-43440"><a href="http://www.businessoffashion.com/category/news-analysis/power-moves">Power Moves</a>

                    </li>
                    <li id="menu-item-53113" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-53113"><a href="http://www.businessoffashion.com/category/news-analysis/the-shows">The Shows</a>

                    </li>
                    <li id="menu-item-45225" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-45225"><a href="http://www.businessoffashion.com/category/week-in-review">Week in Review</a>

                    </li>
                </ul>
            </li>
            <li id="menu-item-40437"...

CSS

var addToHomeConfig= {
    animationIn :'bubble', returningVisitor: false, expire: 11440, touchIcon:true
}
;
 <!-- /// LOAD CHARTBEAT /// --> <script type="text/javascript"> var _sf_async_config= {
}
;
 _sf_async_config.uid=50155;
 _sf_async_config.useCanonical=true;
 (function() {
    function loadChartbeat() {
        window._sf_endpt=(new Date()).getTime();
        var e=document.createElement('script');
        e.setAttribute('language', 'javascript');
        e.setAttribute('type', 'text/javascript');
        e.setAttribute('src', (("https:"==document.location.protocol) ?"https://" :"http://") +"static.chartbeat.com/js/chartbeat.js");
        document.body.appendChild(e);
    }
    var oldonload=window.onload;
    window.onload=(typeof window.onload !='function') ? loadChartbeat : function() {
        try {
            oldonload();
        }
        catch (e) {
            loadChartbeat();
            throw e
        }
        loadChartbeat();
    }
    ;
}
)();
 <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/jquery.flexslider-min.js?ver=1358948047'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/socialite.min.js?ver=1391034710'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/jquery.cookie.js?ver=1372312330'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/jquery.purl.js?ver=1372312330'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/jquery.bofpageview.js?ver=1390051222'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/moment.min.js?ver=1372312330'></script> <script type='text/javascript' src='http://www.businessoffashion.com/wp-content/themes/bof/js/jquery.fancybox-1.3.4.min.js?ver=1390051222'></script> <script type='text/javascript'...

JavaScript

/*screen scrapper document.querySelector(".breadcrumb").textContent);
var outJson = {};
outJson.breadcrumb= document.querySelector (".breadcrumb");
alert(outJson);
alert(JSON.stringify(outJson));
var breadcrumb = document.querySelector (".breadcrumb")
var breadlink = breadcrumb.querySelector ("a");

document.querySelector ("h1")
document.getElementsByClassNAme (h1").onclick = function () { alert ("I've been clicked");}*/

//alert (document.querySelector(".").textContent);

//alert (document.querySelector(".sidebar").textContent);
/*var wrapper = document.getElementById("wrapper");
alert(wrapper.querySelector("h1").textContent);

var goodFoot = document.querySelector("#container");
alert(goodFoot.querySelector("p").textContent)
*/