Just use jquery to get the font list, then add each font to your select:
$.getJSON("https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyB8Ua6XIfe-gqbkE8P3XL4spd0x8Ft7eWo", function(fonts){
for (var i = 0; i < fonts.items.length; i++) {
$('#styleFont')
.append($("<option></option>")
.attr("value", fonts.items[i].family)
.text(fonts.items[i].family));
}
});
EDIT: This uses JSONP
function SetFonts(fonts) {
for (var i = 0; i < fonts.items.length; i++) {
$('#styleFont')
.append($("<option></option>")
.attr("value", fonts.items[i].family)
.text(fonts.items[i].family));
}
}
var script = document.createElement('script');
script.src = 'https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyB8Ua6XIfe-gqbkE8P3XL4spd0x8Ft7eWo&callback=SetFonts';
document.body.appendChild(script);