JSFiddle - React, Tailwind, and code Playground

by Pearlin Lawrence

HTML

<body class="home page page-id-140 page-parent page-template page-template-homepage-php">
    <div id="wrapper">
        <div class="sidebar">	<a href="http://www.goodfootdelivery.com"> <img src="http://www.goodfootdelivery.com/wp-content/themes/goodfoot/images/sidelogo.gif" width="252" height="376" border="0" /></a>

            <br />
            <br />
            	<h1>Who we are and what we do</h1>

            <p>Good Foot provides a personalized point-to-point delivery service on foot or via public transit as well as employment opportunities to people with developmental disabilities. We are a social enterprise and registered charity.</p>
            <p>By supporting Good Foot you are supporting an environmentally-friendly delivery service and helping members of your community get a foothold on independence.</p>
            <p align="center">	<span class='st_facebook_large' displayText='Facebook'></span>

<span class='st_twitter_large' displayText='Tweet'></span>

<span class='st_linkedin_large' displayText='LinkedIn'></span>

<span class='st_pinterest_large' displayText='Pinterest'></span>

<span class='st_googleplus_large' displayText='Google +'></span>

<span class='st_email_large' displayText='Email'></span>	
            </p>
            <br />
            <div id="header">
                <div id="socialMediaBox">
                    <div id="logos">	<a href="http://twitter.com/Good_Foot" id="logo-twitter"><img src="http://www.goodfootdelivery.com/wp-content/themes/goodfoot/images/logo_twitter.png" /></a>		<a href="http://www.facebook.com/GoodFootDelivery" id="logo-facebook"><img src="http://www.goodfootdelivery.com/wp-content/themes/goodfoot/images/logo_facebook.png" /></a>	
                    </div>
                    <div id="socialContent">
                        <img id="whiteArrow" src="http://www.goodfootdelivery.com/wp-content/themes/goodfoot/images/white_arrow.gif" />
                        <div id="socialText">
                           ...

CSS

body {
    text-align: center;
}

JavaScript

var company = {
    Title: document.getElementById("wrapper").querySelector("h1").textContent,
    Mission: document.body.firstElementChild.querySelector("p").textContent,
    Staff: document.querySelector("#container p").textContent
};

var testimonials = {
     HappyCustomer: document.querySelectorAll("p")[5].textContent 
};

var webContent = {
    Content : document.getElementsByClassName("sidebar")[0].textContent
};

var top = document.getElementsByTagName('h4');
var topic = {};
topic.Topic = [] ;
for (var i = 0; i < top.length; i++) {
    topic.Topic.push(top[i].textContent);
   }

//alert (JSON.stringify(testimonials));