Skip to content

Instantly share code, notes, and snippets.

@ravisorg
Created September 15, 2012 22:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ravisorg/3730015 to your computer and use it in GitHub Desktop.
Save ravisorg/3730015 to your computer and use it in GitHub Desktop.
Building HTML in JS
// create the main container for the post
var element = $('<div>',{
'class':'post encrypted',
'id':'post-'+postId,
'data-post-id':postId
});
// avatar
element.append($('<img src="'+post.user.avatar_image.url+'" class="avatar" />'));
// username
element.append($('<div class="username" />').text('@'+post.user.username));
// message text
element.append($('<div class="message" />').text(post.text));
// post time
element.append($('<div class="time" data-created-at="'+post.created_at+'" />').text(post.created_at));
// reply
element.append($('<a href="#" class="btn btn reply" onclick="reply(this); return false;">Reply</a>'));
// reply all
element.append($('<a href="#" class="btn btn replyall" onclick="replyAll(this); return false;">Reply All</a>'));
// add it to the parent container
container.append(element);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment