title: Jquery Text Slide in Effect
body: <p>I want to make text animation like this slide in from left. There are three text fields
  Sports Cargo Bag 
  $14 
  Sale $25</p>
  
  <p>I want these text to be set from jquery and slide in from the left like this <a href="http://platform.mediamind.com/Eyeblaster.Preview.Web/AdPreview.aspx?reportinteractions=0&amp;adid=21081001" rel="nofollow">link</a>
  . This is my code <a href="http://jsfiddle.net/uk72R/2/" rel="nofollow">JsFiddle</a>, i have set these headtext but i want to use jquery method to set these texts</p>
  
  <p><strong>html</strong>  </p>
  
  <pre><code> &lt;div id="mainContainer"&gt;
  
      &lt;div id="logdo"&gt;
       &lt;img  src="http://i.share.pho.to/7346a9ca_o.gif"/&gt;
      &lt;/div&gt;
           &lt;div id="images"&gt;
          &lt;img id="introImg" src="http://i.share.pho.to/9064dfe4_o.jpeg"/&gt;&lt;/div&gt;
      &lt;div id="headlineText"&gt;
          &lt;p id="headline1Txt" &gt;&lt;/p&gt;
          &lt;p id="headline2Txt" &gt;&lt;/p&gt;
     &lt;p id="headline3Txt" &gt;&lt;/p&gt;
  
  
      &lt;/div&gt;
  
      &lt;button class="btn btn-primary" id="ctaBtn" type="button"&gt;SHOP NOW&lt;/button&gt;
  
          &lt;/div&gt;
  </code></pre>
  
  <p><strong>css</strong>    </p>
  
  <pre><code>* {
      margin:0;
      padding:0;
  
  }
  
  
  
  #mainContainer{ text-align: center;
  width:160px;
      height:600px;
   box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
      border:5px solid #BACAE4;
  
      overflow: hidden;
      position: fixed;
  
  }
  
  #images{
      position:absolute;
      top:200px;
      left:3px;
      right:1286px;
      Width:130px;
      height:152px;
  
  }
  #introImg{
      position:absolute;
      top:40px;
      left:7px;
      right:11px;
  
  }
  #headlineText p
  {
      text-align: center;
      position: absolute;
     top:60px;
      left:-120px; 
  Width:120px;
      height:269px;
   line-height:1.0;
      overflow:hidden;
  
  }
  
  #ctaBtn{
          position:absolute;
      top:540px;
      left:26px;
      right:0px;
      Width:106px;
      height:28px;
  
  }
  </code></pre>