jQuery :Создание структуры из нескольких разделов

Я хотел бы построить эту html-структуру с помощью jQuery:

<div id="container">
    <div id="row0">
        <div id="start0"></div>
        <div id="end0"></div>
    </div>
    <div id="row1">
        <div id="start1"></div>
        <div id="end1"></div>
    </div>
</div>

и это то, что я сделал, но это уродливо и не работает, как ожидалось. не могли бы вы мне помочь. Спасибо.

var count = 0;
$("#target").click(function() {
    $('#container').append($('<div></div>')
                   .attr({ id : "row" + count })
                   .addClass("test"));

    for (var i = 0; i < 2; i++) {
        $("#row" + count).append('<div id="start' + count + '</div');
        $("#row" + count).append('<div id="end' + count + '</div');
    } 
    count++;
});