title: Translate custom attributes with i18next (placeholder, value)
body: <p>I am investigating what is possible with <a href="http://i18next.com/index.html" rel="noreferrer">i18next</a> localization library.</p>
  
  <p>Right now I have the following code (<a href="http://jsfiddle.net/SalvadorDali/dLc7x/" rel="noreferrer">full Fiddle is here</a>):</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div data-i18n="title"&gt;&lt;/div&gt;
  &lt;input placeholder="Hello" value="name"&gt;
  &lt;div class="holder"&gt;&lt;/div&gt;
  &lt;button class="lang" data-lang="en"&gt;Eng&lt;/button&gt;
  &lt;button class="lang" data-lang="ch"&gt;Chi&lt;/button&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(document).ready(function () {
      i18n.init({
          "lng": 'en',
          "resStore": resources,
          "fallbackLng" : 'en'
      }, function (t) {
          $(document).i18n();
      });
  
      $('.lang').click(function () {
          var lang = $(this).attr('data-lang');
          i18n.init({
              lng: lang
          }, function (t) {
              $(document).i18n();
          });
      });
  });
  </code></pre>
  
  <p>It translates all <code>text</code> elements, but the problem is that I can not translate <code>custom attributes</code>. For example text inside the div is translated, but I can not understand how can I translate custom attributes like <code>placeholder</code> and <code>value</code>.</p>
  
  <p>Another problem is with my way of translation. Whenever a button <code>Chi</code>, <code>Eng</code> is clicked, I am initializing the translation (but I am not sure this is a correct way). <strong>Edit</strong> I think I found how to solve this problem (I need to use setLng): <code>i18n.setLng(lang, function(t) { ... })</code></p>