Below is the code snippet. I am trying to create 16 x 16 grid divs and after every 15 I am trying to add a new line to it. To do the following I am adding the line class with the value 'change' on every 16th element. But it wouldn't work and all my first 240 elements will have the value 'change' for the 'line' class and the last 16 elements will have the value ''. As intended the console.log for the line displays the right behaviour (i.e. after every 15 nulls there is a change displayed)

```
$(document).ready( function() {
    createDivs(16);
});

var createDivs = function (grids) {
    for (var i = 0; i < grids; i++) {
        var j = 0;
        var line = '';
        for (; j < grids; j++) {
            var grid = '<div id=' + i + '' + j + '></div>';
            if (j === 0) {
                line = 'change';
            }
            console.log(line);
            $('#container').append(grid);
            $('#container > div').addClass('grid-class');
            $('#container > div').addClass(line);
            line = null;
        }
    }
}

```