JSFiddle - React, Tailwind, and code Playground

by lamike

HTML

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="width=device-width, initial-scale=1">    
    <title></title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />
    <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
    <script src="main.js"></script>
    <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
</head> 
<body> 

<div data-role="page" id="mainPage">

    <div data-role="header">
        <h1></h1>
    </div>

    <div data-role="content">    
        <ul id="linksList" data-role="listview" data-inset="true"></ul>
    </div>

    <div data-role="footer">
        <h4>SimpleBlog by Raymond Camden</h4>
    </div>

    
</div>

<div data-role="page" id="contentPage">

    <div data-role="header">
        <a href="#mainPage" data-rel="back">Home</a>
        <h1></h1>
    </div>

    <div data-role="content" id="entryText">
    </div>
        
</div>

</body>
</html>

JavaScript

$(document).ready(function() {

//EDIT THESE LINES
//Title of the blog
var TITLE = "ColdFusion Jedi";
//RSS url
var RSS = "http://pipes.yahoo.com/pipes/pipe.run?_id=08a30473616339c1ad346c6d2180cd61&_render=rss";
//Stores entries
var entries = [];
var selectedEntry = "";

//listen for detail links
$(".contentLink").live("click", function() {
selectedEntry = $(this).data("entryid");
});

//Listen for main page
$("#mainPage").live("pageinit", function() {

//Set the title
$("h1", this).text(TITLE);

$.get(RSS, {}, function(res, code) {
var xml = $(res);
var items = xml.find("item");
$.each(items, function(i, v) {
entry = { 
title:$(v).find("title").text(), 
link:$(v).find("link").text(), 
description:$.trim($(v).find("description").text())
};
entries.push(entry);
});

//now draw the list
var s = '';
$.each(entries, function(i, v) {
s += '<li><a href="#contentPage"'+i+'">' + v.title + '</a></li>';
});
$("#linksList").append(s);
$("#linksList").listview("refresh");
});

});

//Listen for the content page to load
$("#contentPage").live("pageshow", function(prepage) {
//Set the title
$("h1", this).text(entries[selectedEntry].title);
var contentHTML = "";
contentHTML += entries[selectedEntry].link;
contentHTML += '<p/><a href="'+entries[selectedEntry].link + '">Read Entry on Site</a>';
$("#entryText",this).html(contentHTML);
});

});