0

I have this HTML:

<ul>
    <li data-icon="&#xe00a;">1</li>
</ul>

And CSS:

[data-icon]:before {
    content: attr(data-icon);
    ...
}

I would like to increment this value &#xe00a;. Is the next logical progression of this value &#xe00b? And so on until &#xe00f;,&#xe01a;,&#xe01b;, etc.?

Edit:

The purpose is to traverse the entirety of the font icon collection I'm working with.

smilebomb
  • 5,123
  • 8
  • 49
  • 81
  • are you trying to do this increment in css? – depperm Jul 15 '15 at 19:11
  • @depperm No, Javascript as the title states. – smilebomb Jul 15 '15 at 19:12
  • so what have you tried so far? There is no js here. – depperm Jul 15 '15 at 19:13
  • @depperm It's not necessary. How do I take this value `` and use javascript to increment to the next logical step? I don't understand how it works which is why I don't have js code. My attempt at understanding it is right below my `CSS`. – smilebomb Jul 15 '15 at 19:15
  • what format is that value? It isn't hexadecimal – depperm Jul 15 '15 at 19:18
  • @depperm I believe it is `HTML hexadecimal`, but I'm not sure. http://www.w3schools.com/charsets/ref_utf_symbols.asp – smilebomb Jul 15 '15 at 19:20
  • One idea is `parseInt` the hexadecimal part `++` then use http://stackoverflow.com/questions/57803/how-to-convert-decimal-to-hex-in-javascript to convert it back to hex – depperm Jul 15 '15 at 19:25

1 Answers1

3

Do you know how many icons you are dealing with? If your sole purpose is to view them in a list, you can do so with some simple jQuery.

Check out this fiddle for some inspiration: https://jsfiddle.net/bps3Lrcf/

As you can see, (parseInt("e00a", 16) + i).toString(16) will increment the value as you've asked.

Anthony Hilyard
  • 1,220
  • 12
  • 27