Here is a way to set matching icons to your labels all without leaving your HTML.
Just create a new data-icon
attribute on your tag that contains your label and set it equal to the icon you would like to use.
<li data-icon=★>Favorites</li>
And then set your CSS to display the data-icon
attribute before
the label.
li:before {
content: attr( data-icon );
}
On a side note: attr()
works in IE8+.
That’s it. Happy holidays.