title: HTML tags in i18next translation
body: <p>I'm using <a href="http://i18next.com/">i18next</a> to power i18n for my weblog.  It works great on text-only content, but when I try to translate content that includes HTML markup, it is displaying the raw markup when I translate the text.</p>
  
  <p>As an example, here is a snippet of the markup from a post that is not working as expected:</p>
  
  <pre><code>&lt;div class="i18n" data-i18n="content.body"&gt;
    In Medellín they have many different types of &lt;i&gt;jugos naturales&lt;/i&gt;&amp;nbsp;(fruit juice) ... &lt;br /&gt;
    &lt;br /&gt;
    ...
  &lt;/div&gt;
  </code></pre>
  
  <p>The translation code looks like this:</p>
  
  <pre><code>var resources = {
    "en": ...,
    "es": {
      "translation": {
        "content": {
          "body": "En Medellín hay varios tipos diferentes de &lt;i&gt;jugos naturales&lt;/i&gt; ... &lt;br /&gt;&lt;br /&gt; ... "
        }
      }
    }
  }
  
  i18n.init({"resStore": resources}, function( t ) {
    $('.i18n').i18n();
  });
  </code></pre>
  
  <p>When the translation is rendered, HTML tags are escaped and output as text:</p>
  
  <pre><code>En Medellín hay varios tipos diferentes de &amp;lt;i&amp;gt;jugos naturales&amp;lt;/i&amp;gt;...&amp;lt;br /&amp;gt;&amp;lt;br /&amp;gt;
  </code></pre>
  
  <p>How do I get i18next to change the HTML of translated elements?</p>