JSFiddle - React, Tailwind, and code Playground

HTML

<!-- 
Stackoverflow Answer by arttronics for SO Question: http://stackoverflow.com/q/14048943/1195891
-->


<link type="text/css" rel="stylesheet" media="all" href="http://directory.vancouver.wsu.edu/sites/directory.vancouver.wsu.edu/files/css/css_f9f00e4e3fa0bf34a1cb2b226a5d8344.css" />

<div id="facultyAnthropology"></div>

CSS

/* Reminder: CSS asset file loaded with +3000 lines.
   That file is one of many from the web page. Others include print, IE versions etc.
   When creating additional CSS selectors locally, either use exisiting ones from main file or choose CSS Selector name wisely so unforeseen consequences will not occur.
   Side note: Fonts appear different when compared to original webpage in same browser and tiny envelope icon is missing.
*/

#facultyAnthropology{
  margin: 10px;
  min-width: 425px;
}

img {
  margin-top: 15px; /* Global image adjustment: seems necessary here. */
}

JavaScript

// YQL Statement URL: http://y.ahoo.it/umN7j

// YQL Statement used: select * from html where url="http://directory.vancouver.wsu.edu/anthropology" and xpath="//div[@id='content']"

// Note the .ajax() statement is using html as dataType.
// Change anthropology to english to history etc returns directory. Site is based on a Drupal Template.
var directoryName = 'anthropology';

$.ajax({
    type: 'GET',
    url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fdirectory.vancouver.wsu.edu%2F"+directoryName+"%22%20and%20xpath%3D%22%2F%2Fdiv%5B%40id%3D'content-area'%5D%22",
    dataType: 'html',
    success: function(data) {
        $('#facultyAnthropology').append($(data).find('results'));
    }
});


// For Stackoverflow tutorial on YQL and ajax(); with XML, see this link:
//   http://stackoverflow.com/a/14042902/1195891