Cloning the table rows in not working in js

Question

I'm having a table with checkbox. when i select the checkbox and click the copy button the selected row want to clone in to a new table with the selected rows. currently the selected rows in the table is not cloning. i want use JS no jquery. i added jsfiddle below.

function cloneTable() {
  var tabClone = document.getElementById('table');
  var clone = row.cloneNode(true);
  for (var i = 0; i < rowCount; i++) {
    var row = tabClone.rows[i];
    var chkbox = row.cells[0].childNodes[0];
    if (chkbox.checked) {
        table.appendChild(clone);
    }
  }
  createTable();
}

jsfiddle

Answer 1

You are calling the function createTable which leads to creating the table from a scratch. Only thing you need to do is append the table with a clone of the row and changing the checkbox to false for marking that the process has been done.

EDIT

Here is the function cloneTable and above cloneTable() you add the creation of the "second table" for you:

var tableCopy = document.createElement('table');
tableCopy.id = "tableCopy";
tableContainer.appendChild(tableCopy);

function cloneTable() {
  var tabClone = document.getElementById('table');
  var rowCount = tabClone.rows.length;
  for (var i = 0; i < rowCount; i++) {
    var row = tabClone.rows[i];
    var chkbox = row.cells[0].childNodes[0];
    if (chkbox.checked) {
        chkbox.checked = false;
        var clone = row.cloneNode(true);
        if(tableCopy.rows.length == 0){
            var cloneHeader = tabClone.rows[0].cloneNode(true);
            tableCopy.appendChild(cloneHeader)
        }
        clone.cells[1].innerHTML = tableCopy.rows.length - 1;
        tableCopy.appendChild(clone);
        console.log(table)
                console.log(tableCopy)

    }
  }
}