Sugiro fazer um método em jquery, acredito que é o melhor a fazer:
O conteúdo em HTML:
<select name="translate" id="tradutor">
<option value="pt-BR">Portunguês</option>
<option value="en-US">Inglês</option>
<option value="es-GT">Espanhol</option>
<option value="pe-PG">Língua do P</option>
</select>
<div data-translate="pt-BR">
<p data-i18n="content_A">The Book's on the table</p>
<p data-i18n="content_B">Hello World</p>
<p data-i18n="content_C">My name is Ivan</p>
</div>
E o javascript:
$(function() {
var el_translate = $('[data-translate]');
$('#tradutor').val(el_translate.data('translate'));
setLang(el_translate);
$('#tradutor').on('change',function() {
var lang = $(this).val();
el_translate.data('translate', lang);
setLang(el_translate);
});
});
var setLang = function(e) {
var i18n = {
"pt-BR":{
"content_A":"O livro está sobre a mesa",
"content_B":"Olá Mundo",
"content_C":"Meu nome é Ivan"
},
"en-US":{
"content_A":"The Book's on the table",
"content_B":"Hello World",
"content_C":"My name is Ivan"
},
"es-GT":{
"content_A":"El libro está en la mesa",
"content_B":"Hola mundo",
"content_C":"Mi nombre es Iván"
},
"pe-PG":{
"content_A":"PO PliPvro PesPtá PsoPbre Pa PmePsa",
"content_B":"POPlá PMunPdo",
"content_C":"PMeu PnoPme Pé PIPvan"
}
};
var elementos = $("[data-i18n]");
[].forEach.call(elementos, function (el, index) {
el.textContent = i18n[e.data('translate')][el.dataset.i18n];
});
};