Javascript unwanted cell removal from a table

Question

I want to copy paste from excel to webpage. This issue is resolved using Copy/Paste from Excel to a web page

However now I want these fields to be editable and submit it in a form. So I changed the code to :

function generateTable() {
var data = $('textarea[name=excel_data]').val();
console.log(data);
var rows = data.split("\n");

var table = $('<table />');

var counterRow = 0;
    var counterCol = 0;
    for(var y in rows) {
        var cells = rows[y].split("\t");
        var row = $('<tr />');
        for(var x in cells) {
            row.append('<td border-collapse:collapse>' + '<textarea  style="overflow:auto" name=' + counterRow + counterCol + '>' +cells[x]+'</textarea>'+'</td>');
            counterCol++;
        }
        counterRow++;
        table.append(row);
    }

// Insert into DOM
$('#excel_table').html(table);
}

The problem is : there is an additional row containing 1 cell displayed towards the end of the table.

 ___________
|___|___|___|
|___|___|___|
|___|

Answer 1

I had to use this if clause inside the for :

if(rows[y]){