Question

The focus is on the else bit, I am adding a div $('<div id="content" class="span4"></div>').appendTo('.new');, I need to check if I already added 3 divs, and if so, add a new $('<div class="row-fluid new"></div>').insertAfter($row); and then start again

$(".navMore li a").on("click", function() {
    var $el = $(this);
    $('#content').removeAttr('id');
    var $row = $el.closest('.row-fluid');
    if($row.next('.new').length){
        $('<div id="content" class="span4"></div>').appendTo('.new');
    }
    else {
         $('<div class="row-fluid new"></div>').insertAfter($row);
         $('<div id="content" class="span4"></div>').appendTo('.new');
    }
});

Answer 1

Used this:

$(".navMore li a").on("click", function() {
var $el = $(this);
$('#content').removeAttr('id');
var $row = $el.closest('.row-fluid');
var $rowNew = $row.next('.new');

if ($rowNew.children().length >= 3) {
        $('<div class="row-fluid new"></div>').insertAfter($row);
}

if($row.next('.new').length){
        $('<div id="content" class="span4"></div>').appendTo('.new');
}
else {
        $('<div class="row-fluid new"></div>').insertAfter($row);
        $('<div id="content" class="span4"></div>').appendTo('.new');
}
});