title: How to load google fonts?
body: <p>I loaded d dynamic list of <code>web fonts</code> offered by the <code>Google Web Fonts service</code> and place it in a select list ,like :</p>
  
  <pre><code>$.get("https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyChZeTZ-DzMW-45IUBXUSuBha9MWEiXXtI", 
       {}, function (data) {
       $.each(data.items, function (index, value) {
          $('#fonts').append($("&lt;option&gt;&lt;/option&gt;")
                     .attr("value", value.family)
                     .text(value.family);
      });
  </code></pre>
  
  <p>Now what i want is to load each <code>font</code> when user select it from the select list and for this i tried : </p>
  
  <pre><code>$("#fonts").live({ change: function () { 
      $.get("http://fonts.googleapis.com/css?family=" + $(this).val(), {}, 
      function () { alert("font loaded"); }); } });
  </code></pre>
  
  <p>but unfortunately this is not working can anybody please help me out? </p>