Question

Consider the following code snippet about Twitter API. data.followers_count didn’t work if placed in anchor tags. There’s some simple concatenation problem I can’t fix because of the many brackets. Any help is greatly appreciated.

function(data){
   $('#twitter').html( document.getElementById('twitter').innerHTML + twitterusername[i] + ' ' +
   <a href='someURL' title='someTitle'>data.followers_count</a> + ' Followers' + '<br/>');
}

Answer 1

just break them up to simple parts

function(data) {

    //twitter container and it's original HTML
    var twitter = $('#twitter');
    var twitterHTML = twitter.html();

    //your link
    var link = $('<a></a>').attr('href', 'someUrl').text(data.followers_count);

    //everything in an array and joined into a string
    var newHtml = [twitterHTML, twitterusername[i], ' ', link, ' Followers<br/>'].join('');

    //put back in
    twitter.html(newHtml);
}​

and presto! no concatenations and no plus signs!

---

alternatively much shorter solution (i just cleaned code and didn’t notice it was an append operation):

function(data) {

    //build the link
    var link = $('<a></a>').attr('href', 'someUrl').text(data.followers_count);

    //build the HTML
    var newHtml = [twitterusername[i], ' ', link, ' Followers<br/>'].join('');

    //append HTML
    $('#twitter').append(newHtml);
}​