title: Internationalization using "i18n-content" in Google Chrome
body: <p>The <a href="http://code.google.com/chrome/extensions/i18n.html" rel="noreferrer">official documentation</a> recommends retrieving strings for internationalization like so:</p>
  
  <pre><code>document.querySelector("#appname").innerHTML = chrome.i18n.getMessage("appname");
  </code></pre>
  
  <p>However, the source code for the built-in pages such as the new tab page and the in-tab settings page (an example <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/resources/options/browser_options.html?revision=64966&amp;view=markup&amp;pathrev=64966" rel="noreferrer">here</a>) use a different method which doesn't require setting up additional JavaScript commands:</p>
  
  <pre><code>&lt;title i18n-content="appname"&gt;&lt;/title&gt; 
  </code></pre>
  
  <p>I've tried to use this in my own web applications and extensions, but I can't seem to get it to work.</p>
  
  <p>Can anybody shed some light on this? Is it possible to use this in web applications and extensions?</p>
  
  <p><strong>UPDATE:</strong> I've marked Mohamd Mansour's response as accepted, because technically it is correct. If anyone were looking for JavaScript-based solution, I've posted my own answer below.</p>