$("#getTweets").bind("click", function() {
var twitterUsername = $("#twitterUsername").val();
var url = "https://twitter.com/status/user_timeline/" + twitterUsername + "?count=5&format=json&callback=?"
//var url = "http://twitter.com/status/user_timeline/" + twitterUsername + ".json?count=5&callback=?";
$.getJSON(url, function(data) {
var twitterList = $("<ul />");
$.each(data, function(index, item) {
$("<li />", {
"text": item.text
}).appendTo(twitterList);
});
$("#output").fadeOut("fast", function() {
$(this).empty().append(twitterList).fadeIn(3000);
});
})
/*
.success(function() { alert("another chained success"); })
.error(function() { alert("chained error"); })
.complete(function() { alert("chained complete"); });
*/
.done(function() { alert("another chained success"); })
.fail(function() { alert("chained error"); })
.always(function() { alert("chained complete"); });
;
});
<div id="input">
<span>Enter Twitter Username</span>
<input id="twitterUsername" type="text" value="@john_papa"/>
<button id="getTweets">Get Tweets</button>
</div>
<div id="output"></div>
li {
padding:10px;
}
External resources loaded into this fiddle: