How to make use of it:

1. Include the jQuery Langauge Selector plugin on the web page.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/js/LanguageSelector.min.js"></script>

2. Create your translations as below.

// language.js
lang = {
  'en': {
    ':heading': 'Javascript Language Selector',
    ':h2': 'This is the sub heading',
    ':first:p': "Hey! this is the javascript language selector",
    ':english': 'English',
    ':urdu': 'Urdu',
    ':portuguese': 'Portuguese',
    ':choose': 'Choose the language',
  },

  'ur': {
    ':heading': 'جاوا اسکرپٹ زبان سلیکٹر',
    ':h2': 'یہ سب عنوان ہے۔',
    ':first:p': "ارے! یہ جاوا اسکرپٹ کی زبان کا سلیکٹر ہے۔",
    ':english': 'انگریزی',
    ':urdu': 'اردو',
    ':portuguese': 'پرتگالی',
    ':choose': 'زبان کا انتخاب کریں۔'
  },
  'pt': {
    ':heading': 'Seletor de Idiomas Javascript',
    ':h2': 'Este é o subtítulo',
    ':first:p': "Ei! este é o seletor de idioma javascript",
    ':english': 'English',
    ':urdu': 'Urdu',
    ':portuguese': 'Portuguese',
    ':choose': 'Escolha o idioma'
  }
};

3. Create a choose box for the language selector.

<select id="langSelector">
  <option>:choose</option>
  <option value="en">:english</option>
  <option value="ur">:urdu</option>
  <option value="pt">:portuguese</option>
</select>

4. Insert the text to be translated into the document.

<h1>:heading</h1>
<h3>:h2</h3>
<p>:first:p</p>

5. Enable the language selector.

var l = new LanguageSelector();
$(document).on("change", "#langSelector", function () {
  var s = $(this).children("option:selected").val();
  l.setLang(s);
  window.location = "index.html";
});
l.parse();

See Demo And Download