Is there any possibility to create dynamic TR and TD elements in HTML TABLE ? Similarly, but it's better than that:

jQuery(document).ready(function() {
 $('button[name="new-title"]').on('click', function(){
 var table = $('table[name="errortitle"]');
 var tr = $('<tr />');
 var td = $('<td />');
 var input = $('<input />').attr({'class' : 'form-control'})
 var button = $('<button />').attr({'class' : 'btn'});
 var checkbox = input.clone().attr({'type' : 'checkbox', 'name' : 'check'});
 
 var tdId = td.clone().html('-');
 var tdTitle = td.clone().append(input.addClass('formInput').attr({'type': 'text'}));
 var tdCheckBox = td.clone().append(checkbox);
 var tdAction = td.clone().html(button.addClass('btn-danger').html('Usuń'));
 
 tr.append(tdCheckBox);
 tr.append(tdId);
 tr.append(tdTitle);
 tr.append(tdAction);
 
 table.append(tr);
 });
});

Is it possible to nicer code? or more efficient?

I ask about professional example to do that code.

How people write this simple code.

Is it possible to create dynamic TR and TD elements in an HTML table? Something similar but better than this:

jQuery(document).ready(function() {
 $('button[name="new-title"]').on('click', function(){
 var table = $('table[name="errortitle"]');
 var tr = $('<tr />');
 var td = $('<td />');
 var input = $('<input />').attr({'class' : 'form-control'})
 var button = $('<button />').attr({'class' : 'btn'});
 var checkbox = input.clone().attr({'type' : 'checkbox', 'name' : 'check'});
 
 var tdId = td.clone().html('-');
 var tdTitle = td.clone().append(input.addClass('formInput').attr({'type': 'text'}));
 var tdCheckBox = td.clone().append(checkbox);
 var tdAction = td.clone().html(button.addClass('btn-danger').html('Usuń'));
 
 tr.append(tdCheckBox);
 tr.append(tdId);
 tr.append(tdTitle);
 tr.append(tdAction);
 
 table.append(tr);
 });
});

Is it possible to make this code nicer or more efficient?