Should I use i tag for icons instead of span

Question

To display icons, both Facebook's HTML and Twitter Bootstrap HTML (pre-v3) use the I tag.

However, according to the HTML5 specification:

The I element represents a span of text in a different voice or mood, or otherwise offset from the normal prose, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, a ship name, or other prose whose typical typographic presentation is italicized.

Why are they displaying icons with the I tag? Isn't this a bad habit? Is there something I'm missing here?

I'm using span to display icons, and it appears to be working for me so far.