Injecter des icônes font-awesome via JavaScript

Les icônes de font-awesome sont traduites en SVG (Scalable Vector Graphics) à la volée grâce à un script. Le problème quand on injecte du HTML dans le DOM est que le script ne s’exécute pas correctement et l’icône n’apparaît pas. Pour palier à cela, il est possible d’utiliser un générateur de ressources qui est embarqué dans la librairie font-awesome.
Pour éviter au script de s’exécuter sur des icônes qui se répètent, la librairie comprend un script qui permet de traduire une seule fois l’image en SVG pour être réutiliser dans des listes.

<!-- la ligne suivante traduit l'icône en svg et lui donne un alias. Ici "delete" -->
<i data-fa-symbol="delete" class="fas fa-trash fa-fw"></i>

<!-- cet alias peut être réutilisé dans le code grâce à la balise qui fera appel à la ressource déjà créée -->
<svg><use xlink:href="#delete"></use></svg>

<!-- il est également possible de l'utiliser dans le javascript -->
<script type="text/javascript">
  $("#selecteur").append('<svg><use xlink:href="#delete"></use></svg>Remove');
</script>

Comme disent les anglo-saxons, et voilà !

Il y a d’autres exemples d’utilisation : 
https://fontawesome.com/how-to-use/on-the-web/advanced/svg-symbols