JSFiddle - React, Tailwind, and code Playground

HTML

<table id="tab_logic">
</table>
<button id="boton" type="button">Click Me!</button>

CSS

table, th, td {
   border: 1px solid black;
}

JavaScript

function agregar(){
var fila = $('<tr></tr>');
var columna = $('<td></td>');
var input = $('<input type="text" />').attr({name: 'idiomas_usu[]', id:'list1'});
columna.append(input);
input = $('<input type="checkbox" />').attr({name: 'dos', class:'cb2', id:'cb2' });
columna.append(input);
input = $('<input type="text" />').attr({name: 'idiomas_usu[]', id:'list2'});
columna.append(input);
input = $('<input type="checkbox" />').attr({name: 'dos', class:'cb2', id:'cb3' });
columna.append(input);
input = $('<input type="text" />').attr({name: 'idiomas_usu[]', id:'list3'});
columna.append(input);
input = $('<input type="checkbox" />').attr({name: 'dos', class:'cb2', id:'cb4' });
columna.append(input);
input = $('<input type="text" />').attr({name: 'idiomas_usu[]', id:'list4'});
columna.append(input);
input = $('<input type="checkbox" />').attr({name: 'dos', class:'cb2', id:'cb5' });
columna.append(input);
fila.append(columna);
$('#tab_logic').append(fila);
}

function updateBox(event){
	var textbox = document.getElementById("list1");
			var values = [];

			if(document.getElementById('cb2').checked) {
        values.push("1");
    }
   
	 textbox.value = values.join(" ");
}

$('#boton').click(agregar);
$('#tab_logic').on('click', '.cb2', updateBox);