JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr>
<td>
<input id="1" type="checkbox" >
<span>Option1</span></td>
<td>
<input id="2" type="checkbox" name="name1">
</td>
</tr>
<tr>
<td>
<input id="3" type="checkbox"  >
<span>Option2</span></td>
<td>
<input id="4" type="checkbox" name="name1">
</td>
</tr>
<tr>
<td>
<input id="5" type="checkbox"  >
<span>Option3</span></td>
<td>
<input id="6" type="checkbox" name="name1">
</td>
</tr>
</table>

JavaScript

var rows = $('table tr');
var options ='';
var checked;
var languageInput;
var title = '';
var tbody = $('tbody').prepend('<tr><th>Clause Titl1e</th><th>Alternate Language</th></tr>');
clauseOptions = $('input[type=checkbox]');
// add eventHandler
clauseOptions.on("change", function () {
options ='';
rows.each(function (){ 
var row = $(this); 
var clauseInput = row.children().first(); 
checked = clauseInput.find('input[type=checkbox]').prop('checked');
if(clauseInput.attr('name')!== 'name1') 
{
if(checked)
{
		title = clauseInput.text();
    options += title;
		languageInput = row.children().last(); 
		checked = languageInput.find('input[type=checkbox]').prop('checked');
		if(checked)
		{ 
    	options += ':NWFAlternate;';
    }
		else
    {    	
       options += ':NWFStandard;';
		}
alert(options);
}
}
});
});