Problem with jquery! :(

Question

i want to use a variable inside the (main) function of jquery like this ..
var a = "some text"
and then make it innerHTML to <div> tag ..
for these steps there is no Problem .
then :
$ (a).hide()
$(the first letter of (a)).fadeIn(500)
$(the second letter ....
how to select the letters after each other?

Answer 1

Take a look at @Surbhi's code (and @ValentinHacker in the comments):
https://code.sololearn.com/WK2OyhZ75a1R/?ref=app

It's done with sliding visibility + hidden overflow because HTML is tag-oriented (not addressing inside content). If you wanted to control individual letters...here are some ideas:

1. Wrap each letter with its own tag, all with the same name or class so they can be controlled as an array
2. Slide a color-gradient-filled block over the text, simulating fade-in (like a 10% gradient on the left, 100% on the right, and slide right)
3. Use ::before and ::after metatags to collect fully faded-in text on the left ("before" content), fade one character in the middle (innerHTML content), and pull characters from the right ("after" content).
4. Add them on at a time with their own a fade-in timer, to an element that wraps them.

If I'm being complicated, I do that...so I apologize + hopefully someone has a better idea.

Answer 2

you have a function called charAt(index);
var a "text";
a.CharAt(0); // this is 't'

you could try use it inside a for loop to access each character :

for( var I = 0; I < a.length ; I++)
{
alert ( a.CharAt(I) ) ;
}

this alerts every char on the string

For what you're tying to do, I think it's better to put each character in a different tag, and fade each tag individually