.blink {

    -webkit-animation: blink .75s linear infinite;
    -moz-animation: blink .75s linear infinite;
    -ms-animation: blink .75s linear infinite;
    -o-animation: blink .75s linear infinite;
     animation: blink .75s linear infinite;
}

@keyframes blink {
    0%{transition-duration: 0.4s;}
50%{transform:scale(1.6);}
0%{-webkit-transition-duration: 0.4s;}
50%{-webkit-transform:scale(1.5);}
}

<div class="progressive-elems">
            <ul id="mylist">
              <li  class="elem1" >progressive</li>
              <li class="elem2">Safe</li>
              <li class="elem3">Connectivity</li>
              <li class="elem10">Independent</li>
              <li class="elem4">Re-</li>
              <li class="elem11">Engagable</li>
              <li class="elem5">Discoverable</li>
              <li class="elem6">Link</li>
              <li class="elem7">Refreh</li>
              <li class="elem8">Responisve</li>
              <li class="elem9">APP-LIKE</li>
            </ul>
          </div>

$(document).ready(function() {

  var $liCollection = $(".progressive-elems li");

  var $firstListItem = $liCollection.first();
  console.log($firstListItem);

  $liCollection.first().addClass("blink ".$firstListItem );

  setInterval(function() {

      var $activeListItem = $(".blink ".$firstListItem);

      $activeListItem.removeClass("blink ".$firstListItem);

      var $nextListItem = $activeListItem.closest('li').next();

      if ($nextListItem.length == 0) {
          $nextListItem = $firstListItem;
      }

      $nextListItem.addClass("blink ".$firstListItem);
  }, 500);
});​