How to use Roboto Light/Thin from google fonts in Chrome
First of all — avoid using !important. There is very limited number of scenarios when this is actually necessary.
Roboto and Roboto Condensed are provided as two separate font families by Google Fonts, so if you want to use the condensed version, you will have to declare font-family: "Roboto Condensed" as the condensed variant is not included in the Roboto font family.
Roboto Condensed has also a more limited amount of font weights available: 300, 400 and 700 compared to Roboto's 100, 300, 400, 700 and 900. Simply speaking, using font weight of 100 and 900 will not work with Roboto Condensed, and will fallback to the nearest possible font-weight.
How can you confirm that Roboto Condensed is not using the 300 font weight? It seems to be working fine with me (I'm also using it on a few sites)... also working fine in this fiddle: http://jsfiddle.net/8k72a/1/
Therefore, it is not possible to get Roboto Condensed with a font weight of 100, for example.
With your updated question, why not use this script instead? I see that you have broken your CSS styles into several lines — remember to escape the linebreaks in JS with a backslash \:
var css = '@import url(https://fonts.googleapis.com/css?family=Roboto:100,100italic,300,300italic,400,400italic,500,500italic,700,700italic,900,900italic&subset=latin,latin-ext,cyrillic,cyrillic-ext,greek-ext,greek,vietnamese);\ @import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300italic,400,400italic,700,700italic&subset=latin,latin-ext,cyrillic-ext,cyrillic,greek-ext,greek,vietnamese);\ @import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700&subset=latin,latin-ext,greek-ext,greek,vietnamese,cyrillic,cyrillic-ext);', head = document.head || document.getElementsByTagName('head')[0], style = document.createElement('style');style.type = 'text/css';if (style.styleSheet){ style.styleSheet.cssText = css;} else { style.appendChild(document.createTextNode(css));}head.appendChild(style);