Don't waste any time coding complex language changing code in JS, just add a few attributes to your HTML elements instead!
Demonstration on this page
<script src="https://cdn.jsdelivr.net/gh/Sv443/langapplier@1/langapplier.js"></script><body data-default_lang="YOUR_LANG_CODE">
<!-- I recommend using a sequence of chars before the lang code (for example: __EN), because it may conflict with your specified content otherwise --><div class="langapp"></div><!-- in this example __EN and __DE are my language codes -->
<!-- when the language change function gets called it will search for that code -->
<!-- here's how to use it: -->
<!-- (you can also stack the attributes to change multiple things at once) -->
<div class="langapp" data-lang_content="__EN°English Content|__DE°German Content">
<!--(this affects the innerHTML of the element)-->
<div class="langapp" data-lang_title="__EN°English Content|__DE°German Content">
<!--(this affects the title attribute of the element)-->
<img class="langapp" data-lang_src="__EN°http://url.to/your/image_EN.png|__DE°http://url.to/your/image_DE.png">
<!--(this affects the src attribute of the element)-->
<!-- the same thing can be applied to the onclick, href and placeholder attributes using "data-lang_onclick", "data-lang_href" or "data-lang_placeholder" respectively -->Syntax (remove spaces): LANG1_CODE ° LANG1_CONTENT | LANG2_CODE ° LANG2_CONTENT (you can add infinite languages)
langapp.change("LANG_CODE");document.addEventListener("lang_change", yourFunction);5. The document's lang dataset contains the currently selected language so you can read it like this
var xy = document.body.dataset.lang;<meta id="langapplier_disable_watermark"><meta id="langapplier_enable_debug">