
The Goal:
Sometimes you might want to replace text with an icon in the navigation, or replace the verbiage output of a particular word.
Requirements:
- HTML & CSS
- jQuery
- Font Awesome
Before

After

jQuery
Add this to your custom scripts.
// Trim Navigation with Icon
$( ".item_text" ).each(function() {
//get the text for just the element being iterated over
var text = $(this).text();
var comparingText = 'Location';
if(text == comparingText){
$(this).replaceWith("<i class="fas fa-map-marker-alt"></i>");
}
});
$( ".item_text" ).each(function() {
//get the text for just the element being iterated over
var text = $(this).text();
var comparingText = 'Location';
if(text == comparingText){
$(this).replaceWith("<i class="fas fa-map-marker-alt"></i>");
}
});