Limit text length on mobile, responsive (trim text/string) jQuery, CSS3, Bootstrap

Trim text/string when on mobile using jQuery.

by Yatko

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="row">
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>lorem ipsum </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>dolor sit amet </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>consectetur </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>adipisicing elit </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>sed do eiusmod tempor </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>incididunt ut labore </a></div>
	<div class="col-xs-6 col-sm-4 col-lg-2 limit"><a href>et dolore magna aliqua </a></div>
</div>

JavaScript

$(function(){
  $(".limit").each(function(i){
    len=$(this).text().length;
    if(len>10)
    {
      $(this).text($(this).text().substr(0,10)+'...');
    }
  });       
});