jQuery addClass example

Change class name on click in jQuery

by rhernando

HTML

<html lang="fr-FR">
  <body>
    <a href="#">Facebook Link
      <i class="fa-facebook"></i>
    </a>
    <a href="#">Facebook Link
      <i class="fa-facebook"></i>
    </a>
  </body>
</html>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

button {
  background: #0084ff;
  border: none;
  border-radius: 5px;
  padding: 8px 14px;
  font-size: 15px;
  color: #fff;
}

a {
  display: block;
  color: #fff;
  margin-bottom: 20px;
}

JavaScript

$(document).ready(function() {
      
      const documentLanguage = $("html").attr("lang");
      const facebookLinks = $(".fa-facebook");

      facebookLinks.each(function(index, link) {
        if (documentLanguage === "fr-FR") {
          $(link).parent().attr("href", "https://facebook.com/my-french-site/");
        } else if (documentLanguage === "en-EN") {
          $(link).parent().attr("href", "https://facebook.com/my-english-site/");
        }
      });
    });