JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" class="friend" id="abbsmalone_select" />
<input type="checkbox" class="friend" id="cchkorea_select" />
<br/>
<input id="deselect_all" type="button" class="form_button2"  value="deselect all" style="float: left;">
<input id="select_all" type="button" class="form_button2"  value="select all" style="float: left;">

JavaScript

function selectAll() {
    jQuery(".friend").prop('checked', true);
}

function deselectAll() {
    jQuery(".friend").prop('checked', false);
}

jQuery(function() {
    jQuery("#deselect_all").click(deselectAll);
    jQuery("#select_all").click(selectAll);
});