Correctly inputed text changes image
<p>I have been developing a script that when a user types in correctly entered text the images will change the letter, letting the user know they entered it in correctly. </p>

<p>Preview here:  Example word is "ate".
<a href="http://jsfiddle.net/wjx6b/2/" rel="nofollow">http://jsfiddle.net/wjx6b/2/</a>  </p>

<p>I made sure it was set to check the index by using</p>

<pre><code>$.each(text, function(index, item)
</code></pre>

<p>My problem is when I try setting it to a foreign word like "taberu" which is Japanese, I have to have two letters in each of the var text boxes like this</p>

<pre><code>var text = ['ta', 'be', 'ru'];
</code></pre>

<p>but when I set it to that nothing happens when I start to type.  Thanks to anyone who can help!</p>
