truncat sample

by Marcus

HTML

<script src="src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js&quot;"></script>
<div class="cardClass" id="cardId01">
  Lorem ipsum dolor sit amet, ut usu veniam numquam interesset, laudem eleifend constituto in sit, pro no vulputate repudiandae. 
</div>

<div class="cardClass" id="cardId02">
  Lorem ipsum dolor sit amet, ut usu veniam numquam interesset, laudem eleifend constituto in sit, pro no vulputate repudiandae. Ne fugit latine torquatos vel. Sed purto ipsum in, etiam commodo reprehendunt ea duo. Cu mea copiosae perpetua persecuti, in dicta soleat denique eam. Vis summo populo pertinax eu, vidit lorem an vel. Has albucius scribentur no, ea brute habemus nusquam cum, ex vivendo tibique mel.

No ius aeque eligendi dissentias, qui no oratio omnesque probatus, ius ut fugit tritani partiendo. Quis voluptua adolescens has te. Ea eum civibus fabellas, sumo perfecto sea cu. Et utinam vivendum constituto nec.

Ex rebum phaedrum est, has natum graece perpetua in. Ex detracto disputando eum, ei soleat quaerendum contentiones ius. Phaedrum perpetua ullamcorper usu ea, no modus assentior mel. Vel ex discere detracto appellantur. Vim vocent aliquip maluisset no. At per nullam persecuti.

Clita animal pertinacia has id, vel ne tempor audire, quo meis ornatus mnesarchum ei. Id mei dico molestie. Mucius erroribus scribentur et nam, soleat soluta dissentias mea at. Ponderum honestatis scribentur ius ad, denique conceptam deterruisset ex pri. Ad duo esse electram assentior. Has illum dignissim aliquando cu, feugiat ceteros te est.

Ea sed idque adversarium, ei brute verear commodo pri. Fugit voluptatibus per an, ad duo quem audire consectetuer. Vis no quando placerat gloriatur. Et epicurei elaboraret per, ea has eros ullum graeco.
</div>

<div class="cardClass" id="cardId03">
Lorem ipsum dolor sit amet, ut usu veniam numquam interesset, laudem eleifend constituto in sit, pro no vulputate repudiandae. 
</div>

<div class="cardClass"...

CSS

.cardClass{
  width:300px;
  height:100px;
  /*overflow:auto;*/
  border:1px solid #000;
  margin: auto;
  margin-top:20px;
  clear:both;
}

JavaScript

$('.cardClass').each(function(){
    var myTag = $(this.id).html().text();
    
    if (myTag).length > 100){
        $(mytag).substring(101, maxlength) + "...";
    }
});