I want to put value of ID at html tag of jquery, here's my code :

var numCols = 1;
$.each(date, function(i) {
        if (!(i % numCols)) tRow = $('<tr>');

        tCell = $('<td>').html(i + 1);
        $('#result').append(tRow.append(tCell));
        tCell = $('<td>').text('Due Date');
        $('#result').append(tRow.append(tCell));

        tCell = $('<td>').html(date[i]);
        $('#result').append(tRow.append(tCell));

        tCell = $('<td>').text('Start Showing On');
        $('#result').append(tRow.append(tCell));

    tCell = $('<td>').html('<button type="button" system-id="$(i + 1)">Preview</button>'); $('#result').append(tRow.append(tCell));

I want to put ID dynamically at system-id --> system-id="$(i + 1)".
What's wrong with my code?