求jQuery 实现文字逐个变色的效果，小女子多谢了！

求jQuery 实现文字逐个变色的效果，小女子谢谢了！！！

<div id="a">

<div class="b" >我好想你</div>

<div class="b" >嫁给我吧</div>

<div class="b" >不行</div>

<div class="b" >为什么啊</div>

<div class="b" >你不爱我啊</div>

</div>

让这些文字逐个变色，一直变
------解决思路----------------------
先用JS把里面的文字一个一个的用span包起来。

然后用你说的这个插件，选择器是这些span就可以了。
------解决思路----------------------

$('.b').each(function(){

  var text = this.innerHTML;

  text = text.split('');

  for(var i=0;i<text.length;i++){

    text[i] = '<span>'+text[i]+'</span>';

  }

  this.innerHTML = text.join('');

})

function randomColor(){

  var r = parseInt(Math.random()*255);

  var g = parseInt(Math.random()*255);

  var b = parseInt(Math.random()*255);

  return ['#',r.toString(16),g.toString(16),b.toString(16)].join('')

}


$('.b span').each(function(){

  var fn = arguments.callee;

  $(this).animate({color:randomColor()},200,function(){

    fn.call(this)

  })

})

自己引入那个插件。
------解决思路----------------------

$('.b span').each(function(){

  var fn = arguments.callee; //什么意思啊--fn指向函这个函数本身，为了省一个变量名

  $(this).animate({color:randomColor()},200,function(){

    fn.call(this);// //什么意思啊--在前一次渐变结束之后再次调用一次这个方法，并且把this指向当前的元素，不然之后执行$(this).animate的时候this就不是选择的span了

  })

})

------解决思路----------------------
$('.b').each(function(){
  var text = this.innerHTML;
  text = text.split('');
  for(var i=0;i<text.length;i++){
    text[i] = '<span>'+text[i]+'</span>';
  }
  this.innerHTML = text.join('');
})
function randomColor(){
  var r = parseInt(Math.random()*255);
  var g = parseInt(Math.random()*255);
  var b = parseInt(Math.random()*255);
  return ['#',r.toString(16),g.toString(16),b.toString(16)].join('')
}

var speed = 200;
$('.b span').each(function(i){
       var span = $(this);
       setTimeout(function(){
              span.animate({color:randomColor()},200)
       },speed*i);
})

按他的改改 

不过这样只是 快字独立逐个改色

我觉得你的需求是不是和 唱歌的字幕一样  从头到尾涂过去

这样的话  你需要 在 原来的 文字块上放 一个带 颜色的文字块
变色就是 上面的颜色文字块的 宽度 从 0%－－100%