title: Percentage Progressing Bars
body: <p>I just found animation progressing bars <a href="http://jsfiddle.net/mWdgz/4/" rel="nofollow">here</a></p>
  
  <p>I wonder how to add number % running for each bar while these progressing bars are loading.</p>
  
  <p>Please help.  Thank you!</p>
  
  <p>Here is CSS</p>
  
  <pre><code>    &lt;style type='text/css'&gt;
      .progress_container {
      height:25px;
      border-radius: 3px;
      overflow:hidden;
      background:red;
      width: 460px;
  }
  .progress_bar {
      height:25px;
      width: 0px;
      -moz-border-radius:3px;
      -webkit-border-radius:3px;
      border-radius:3px;
      background:black;
  }
  .progress_container {
      margin-bottom: 30px;
  }
  }
    &lt;/style&gt;
  </code></pre>
  
  <p>Here is JQuery</p>
  
  <pre><code>  &lt;script type='text/javascript'&gt;//&lt;![CDATA[ 
  $(window).load(function(){
  $("document").ready(function () {
  
      // animate the progress bar onload
  
      $('.progress_bar').each(function () {
          $(this).animate({
              width: this.title
          }, 1000);
      })
  
  });
  });//]]&gt;  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Here is the body</p>
  
  <pre><code>  &lt;div class="progress_container"&gt;
      &lt;div class="progress_bar tip" title="98%"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="progress_container"&gt;
      &lt;div class="progress_bar tip" title="58%"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="progress_container"&gt;
      &lt;div class="progress_bar tip" title="28%"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>