How can I charge google font

Question

I have to charge the google font, but when I have a font with two, three words it doesn't works, works with 1 word ? Exemple, I want use this font "Snowburst One", but I have an error GET http://fonts.googleapis.com/css?family= 400 (Bad Request)

$.get("https://www.googleapis.com/webfonts/v1/webfonts?key=AIzaSyChZeTZ-DzMW-45IUBXUSuBha9MWEiXXtI",  {},
function (data) {
// load the css au chargement
var $load_css_font = $("#primary-navigation div ul li a").css('fontFamily');

console.log( $load_css_font );
$('body')
.append("<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=" +     $load_css_font.replace(/\s+/g," ⇉
    $('#primary-navigation div ul li a').css({'font-family':'"'+$load_css_font+'"'});
   console.log( $load_css_font );
 });

}`

EDIT: I replace the /t, \n, \r by a space

replace(/\s+/g," ")

Answer 1

You are replacing the space here

.replace(/\s+/g," ⇉
    $('#primary-navigation div ul li a').css({'font-family':'"'+$load_css_font+'"'});

Which is turning the link href tag's attribute to

http://fonts.googleapis.com/css?family= restOfCodeHere&etc=123

As you can see there is a space after the family= .