JSFiddle - React, Tailwind, and code Playground

HTML

Two checkboxes are checked by default. 

<br><br>Click some of the checkboxes, then click Select to display the ID values, and Undo to reset to the initial state.
<br><br>

<table> 
    <tr>
        <td>
            <div>
                <input type="checkbox" id="home1">Home1</input>
                <input checked='checked' type="checkbox" id="home2">Home3</input>
                <input type="checkbox" id="home3">Home3</input>
                <input checked='checked' type="checkbox" id="home4">Home4</input>
            </div>
        </td>
        <td id="selectedhome"> </td>
    </tr>
</table>

<input type="button" value="Select" />

<input type="button" value="Undo" />

JavaScript

$('input[value=Select]').click(function() {
    var values = $('table :checkbox:checked').map(function() {
        return this.id;
    }).get().join(',');
    var home = $('#selectedhome').text(values);
});

$('input[value=Undo]').click(function() {
    $('table :checkbox').each(function() {
        this.checked = this.defaultChecked;
    });
});