jquery - formatting each statement results inside a grid? -


so have fetched , parsed data , using 'each' display it:

$.ajax({     url      : 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeuricomponent('http://news.google.com/news?pz=1&cf=all&ned=uk&hl=en&output=rss'),     datatype : 'json',     success  : function (data) {         if (data.responsedata.feed && data.responsedata.feed.entries) {             $.each(data.responsedata.feed.entries, function (i, e) {                 $('.row').append("<div class=\"threecol\"">title: " + e.title + "<br></div>");             });         }      } }); 

and grid function needs follow structure:

<div class="container">     <div class="row">         <div class="threecol">         </div>         <div class="threecol">         </div>         <div class="threecol">         </div>         <div class="threecol last">         </div>     </div> </div> 

so question is, how sort through each statement , place every 4 items new row , make every 4th item have class "threecol last" instead of "threecol"?

add counter before $.each loop, , add simple conditions insert rows @ correct position, , assign correct classes:

if (c % 4 == 0) {    $('<div />').addclass('row').appendto('.container');  }  $('<div />').addclass('threecol')             .text('title: ' + e.title)             .appendto('.row:last');  if (c % 4 == 3) {   $('.threecol:last').addclass('last'); }  c++; 

Comments

Popular posts from this blog

monitor web browser programmatically in Android? -

Shrink a YouTube video to responsive width -

wpf - PdfWriter.GetInstance throws System.NullReferenceException -