Replace Twitter icon with the new Twitter X icon on SAP Career Site

twitterIcon.html

<script>

/*
* This script uses a workaround to replace the old Twitter logo
* with the new Twitter X logo, when it is not possible to upgrade
* the Fontawesome library on a third party platform - in this case
* SAP SuccessFactors.
*
* Author: Pascal Aubort and Google Bard :)
*/

// Add an event listener for the DOMContentLoaded event.
document.addEventListener('DOMContentLoaded', function() {
  // Get the element by class name "fa fa-twitter".
  const twitterIcon = document.querySelector('.fa.fa-twitter');

  // If the element does not exist, exit the script.
  if (!twitterIcon) {
    return;
  }

  // Remove the "fa-twitter" class from the element.
  twitterIcon.classList.remove('fa-twitter');

  // Create the new SVG element.
  const newSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
  newSvg.setAttribute('height', '1em');
  newSvg.setAttribute('viewBox', '0 0 512 512');
  newSvg.innerHTML = `<style>svg{fill:#627d77}</style><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/>`;

  // Try to replace the content of the Twitter icon with the new SVG element.
  // If an error occurs, log the error to the console.
  try {
    twitterIcon.innerHTML = newSvg.outerHTML;
  } catch (error) {
    console.error(error);
  }
});
</script>