Feature: Wrap all letters in a specific class

[lakhman]

This is an awesome plugin, it's exactly what I need and has great performance.

The only issue for my use case, is that I want every letter to have a span, rather than class="char4".

Example:

<!-- Current -->
<span class="char1" aria-hidden="true">C</span>
<span class="char2" aria-hidden="true">O</span>
<span class="char3" aria-hidden="true">N</span>
<span class="char4" aria-hidden="true">T</span>
<span class="char5" aria-hidden="true">E</span>
<span class="char6" aria-hidden="true">N</span>
<span class="char7" aria-hidden="true">T</span>
<span class="char8" aria-hidden="true">S</span>

<!-- Is this possible? (Each letter has a specific class) -->
<!-- Notice: 'char-t' is being used twice  -->
<span class="char-c" aria-hidden="true">C</span>
<span class="char-o" aria-hidden="true">O</span>
<span class="char-n" aria-hidden="true">N</span>
<span class="char-t" aria-hidden="true">T</span>
<span class="char-e" aria-hidden="true">E</span>
<span class="char-n" aria-hidden="true">N</span>
<span class="char-t" aria-hidden="true">T</span>
<span class="char-s" aria-hidden="true">S</span>

So all the letter is lowercased, then added a class that we can style that individual letter with?

I managed to do this via: (to fit my needs for now).. but could be a useful plugin feature seeing as there is no other libraries that do this.

    // Within jquery.letter.js line 20
    inject += '<span class="'+klass+(item)+'" aria-hidden="true">'+item+'</span>'+after;

[camtin]

I agree this would be useful, also would love to see the same thing with words

[davatron5000]

I think we were trying to get to this in prior issues (#2, #7, #10, #41, #45) where the character goes in a data-char attribute so you can style kerning pairs. There are a lot of edge cases, but if you don't think you have them, this could be a simple loop you could write yourself.

$('h1').lettering().children('span').each(function(){
  $(this).data('char', $(this).text() );
});

Sorry it took so long to respond. Hopefully you found an answer.

[lakhman]

I managed to hack the core to do what I needed to do, would be a great "out the box" feature for others. Thanks!