title: Print image instead of text
body: <p>I have this snippet of code that I have been using to check to see if a user is online on hitbox.tv or not. However I would like to make it so instead of printing out a text string it would print out an image to display whether the user is online of not. Is there a way to use a default image and display it with the username overlay-ed on it?</p>
  
  <p><a href="http://jsfiddle.net/foz3dL53/" rel="nofollow">http://jsfiddle.net/foz3dL53/</a></p>
  
  <pre><code>$(document).ready(function () {
      $("#formButton").click(function () {
          var channel = $("#channelName").val();
          $.getJSON("http://api.hitbox.tv/media/live/" + channel.toLowerCase(), function (data) {
              var mediaIsLive = data.livestream[0].media_is_live;
              if (mediaIsLive == 1) {
                  return $("#liveNotification").text(channel + " is online");
              }
              return $("#liveNotification").text(channel + " is offline");
          }).error(function () {
              $("#liveNotification").text("I'm not sure :o");
          });
      });
  });
  
  
  &lt;p&gt;Stream status: &lt;span id="liveNotification"&gt;-&lt;/span&gt;
  &lt;/p&gt;
  &lt;form&gt;
      &lt;p&gt;Type the channel's name below&lt;/p&gt;
      &lt;input type="text" value="gravvy" id="channelName" /&gt;
      &lt;input type="button" value="Check if live" id="formButton" /&gt;
  &lt;/form&gt;
  </code></pre>