JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="1" value="Metallic Effects">
<label for="1">Metallic Effects</label>
<input type="checkbox" id="2" value="Unique Labels">
<label for="1">Unique Labels</label>
<input type="checkbox" id="3" value="Sample Labels">
<label for="1">Sample Labels</label>

CSS

input {
    display:inline-block;
}

JavaScript

function getCheckValue() {
    //Get values of Checkboxes
    var value = $('input:checkbox').map(function () {
        return this.value;
    }).get();

    return value[0]; //Return value 0 Metallic Effects in this case
}

var checkboxValue = getCheckValue();
alert(checkboxValue);


if ($('input:checkbox').val() == checkboxValue) {
    //$('input:checkbox').val(checkboxValue).prop("checked", "checked");
    $('input[value="'+checkboxValue+'"]:checkbox').prop("checked", "checked");
}