I want to add a transition property to an element which contains text coming from an angular controller.

I want to move it from right to left when the document loads. Is there any way to do that. here is my sample code. 

**Index file excerpt**

```
<div class="logArena">

  <ul class="timeline">
    <li ng-repeat="log in changelogCtrl.logs | orderBy: '-dateObj'">
      <span class="direction-l">
        <span class="time-wrapper">
            <span class="time">
               {{log.date}}
            </span>
          </span>
      </span>

      <div class="direction-r">
        <div class="flag-wrapper">
          <div class="flag">

            <span id="axis">
              <span class="move-left">
                <strong>{{log.module}}</strong>&nbsp;<strong class="fa fa-long-arrow-right"></strong>&nbsp;{{log.subModule}}
              </span>
            </span>

          </div>
        </div>
        <div class="desc">
          {{log.desc}}
        </div>
      </div>
    </li>
  </ul>
</div>

```

> 
> CSS Except (Right now I tried it with hover but it didn't work too, but I want it to automatically come from right to left on page load.)
> 
> 
> 

```
#axis:hover .move-left{
    transform: translate(350px,0);
    -webkit-transform: translate(350px,0); /** Safari & Chrome **/
    -o-transform: translate(350px,0); /** Opera **/
    -moz-transform: translate(350px,0); /** Firefox **/
}

```