JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
<script src="http://knockoutjs.com/examples/resources/twitterApi.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/black-tie/jquery-ui.css">
<script id="tweetTemplate" type="text/x-jquery-tmpl">
<li>
<img src="${ profile_image_url }"/><a class="twitterUser" href="http://twitter.com/${ from_user }">${ from_user }</a>${ text }
</li>
</script>
<script id="tweetsTemplate" type="text/x-jquery-tmpl">
<h1>${Title}</h1><input type="button" id="updateButton" value="update"/>
<ol id="tweetList">
{{tmpl(Tweets) "#tweetTemplate"}}
</ol>
</script>
<div id="placeHolder"></div>a
JavaScript
var twitter = {
Title: "Tweets From Tumblr",
Tweets: []
};
function updateTweets() {
twitterApi.getTweetsForUsers(["tumblr"],
function(data) {
var item = $("#tweetList").tmplItem();
item.data.Tweets = data;
item.update();
});
};
$("#tweetsTemplate").tmpl(twitter).appendTo("div");
$("#updateButton").button().click(updateTweets);