JSFiddle - React, Tailwind, and code Playground

by LuckyLuzz

HTML

<ul class="lng"><li><a href="#de">de</a></li><li><a href="#fr">fr</a></li></ul>
    
<div><a href="#somelink">somelink</a>
    <h1>some title</h1></div>
<p>some content</p>

JavaScript

var translation, translate;

translation = {
    "fr": {
        "div > a:eq(0)": "un lien",
        "div h1"       : "un title",
        "p"            : "du contenu"
    },
    "de": {
        "div > a:eq(0)": "ein Link",
        "div h1"       : "ein Titel",
        "p"            : "eigen Inhalt"
    }
}
    
    
translate = function( lng,translationObj ){
    if( lng && translationObj[lng] ) {
        return $.each(translationObj[lng], function(k,v){
             $(k).text(v);  
        });
    }else{
        return $.error("arrete voir");
    }
}


$("ul.lng a").bind("click", function(event){
    event.preventDefault();
    translate( $(this).text(), translation); 
    //translate("fr", translation);
});