var tweeter = Twitcher("where your god now tebow"),
    template = '\
    <li class="toot"> \
        <a class="author" href="http://www.twitter.com/{{from_user}}"> \
            <img class="avatar" src="{{profile_image_url}}" /> \
            <span class="username">@{{from_user}}</span> \
        </a> \
        <blockquote class="status"> \
            {{text}} \
        </blockquote> \
        <a class="date" href="http://www.twitter.com/{{from_user}}/status/{{id_str}}">{{created_at}}</a> \
    </li> \
    ',
    hogan = Hogan.compile(template);

tweeter.load(function (response) {
    var complete = $('.completed'),
        status = $('.status'),
        tweetHtml = $('.tweets'),
        toots = response.results;

    complete.html('Completed in: <span class="seconds">' + response.completed_in + '</span> seconds');
    if (toots.length) {
        $.each(toots, function (i, toot) {
            tweetHtml.append(hogan.render(toot));
        });
    }
    
});

Following resources are loaded into result:

  1. twitcher.js
  2. hogan.js
<h1>Where's your god now Tebow?</h1>
<p class="completed"></p>
<ul class="tweets">
</ul>
<p class="mark">Made by <a href="http://mwunsch.tumblr.com">Mark Wunsch</a></p>
body { 
    padding: 5px; 
    color: #404040; 
    background: #C5C5C5; 
    font-family: helvetica, arial, sans-serif; 
}
h1, .completed, .mark { text-align: center; }
h1 { font-weight: bold; }
.completed, .mark { font-size: 12px; }
.toot { 
    margin: 5px; 
    padding: 5px; 
    border-bottom: 1px solid #adadad; 
    background: #fff;
}
.author {text-decoration: none;}
.author. avatar, .author .username {display:inline-block; }
.author .username { 
    line-height: 48px; 
    height: 48px; 
    vertical-align: top;
}
.date { font-size: 12px; }
.status {font-family: Georgia, Times, serif; font-size:22px; line-height:28px;}