Count number of rows inside a div element

Problem

As shown in the image below, I have several div inside a div (outer div). I need to count the number of rows the outer div have. In this example the row count is 5.

Note:The inner div is floated left and its content is created dynamically.

Does anyone has any ideas?enter image description here

Problem courtesy of: Pinoy2015

Solution

Perhaps something along the lines of:

Demo Fiddle

var minLeft = null, rows = 0;
$('div div').each(function () {
    var left = $(this).offset().left;
    if (left <= minLeft || minLeft==null) {        
        rows++;
        minLeft=left;
    }
});
console.log(rows);
Solution courtesy of: SW4

Discussion

Try with something like this:

var parentX = $('#containerDiv').position().left;
var rows = 0;

$('#containerDiv div').each(function(){
  if( $(this).position().left == parentX ){
    ++rows;
  }
});

alert('Num of rows: ' + rows );
Discussion courtesy of: TheGr8_Nik

This recipe can be found in it's original form on Stack Over Flow.