HTML Template

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Lorem Ipsum Sucka</title>
</head>
<body>
  <label class="label"></label>
  <div>
    <button id="language" class="button"></button>
  </div>
</body>
</html>

CSS

html[lang='en'] .label::before {
   content: "Read this: ...";
}
html[lang='en'] .button::before {
   content: "DE";
}

html[lang='de'] .label::before {
  content: "Lies das: ...";
}
html[lang='de'] .button::before {
   content: "EN";
}

JavaScript

document.getElementById("language").addEventListener("click", () => {
  
  const element = document.getElementsByTagName("html")[0];
  
  if (element.getAttribute('lang') === 'en') {
  	element.setAttribute('lang', 'de');
  } else {
  	element.setAttribute('lang', 'en');
  }
  
});