Display your coderwall.com badges without using a library like jQuery

coderwall.coffee

# Display your coderwall.com badges without using a library like jQuery

# CONFIGURE your username
username = 'optikfluffel'

url = "http://www.coderwall.com/#{username}.json?callback=processJSON"

loadJSON = (url) ->
  head = document.getElementsByTagName('head')[0]
  newScript = document.createElement('script')
  newScript.type = 'text/javascript'
  newScript.src = url
  head.appendChild newScript

window.processJSON = (results) ->
  # CONFIGURE the id of the element you want to add the badges to
  element = document.getElementById('coderwall')
  # CONFIGURE the size of the badges
  badgeSize = 55

  for item in results.data.badges
    newLink = document.createElement('a')
    newLink.href = "http://www.coderwall.com/#{username}"

    newImage = document.createElement('img')
    newImage.src = item.badge
    newImage.title = "#{item.name}: #{item.description}"
    newImage.alt = item.name
    newImage.height == newImage.width = badgeSize

    newLink.appendChild newImage
    element.appendChild newLink
  return

loadJSON url

This would be more performant if you'd use a DocumentFragment to buffer all the DOM changes within the loop and attach it to the live DOM at the very end.