JSFiddle - React, Tailwind, and code Playground

HTML

<table>  
    <tbody>                
        <tr>
            <th>Direction</th>
                <td>
                    <select id='work_direction' name="workorder[work_direction]" class='required'>
                        <option value=''>Select</option>
                        <option value="domestic">Domestic</option>
                        <option value="offshore">Offshore</option>
                        <option value="mexico">Mexico</option>
                    </select>
                        <span class='error'></span>
            </td>
        </tr>
    </tbody>
</table>
<br/>

<tr>
                        <th>Departments Affected?</th>
                        <td>
                            <ul style="list-style-type:none;">
                                <li>
                                <span class="error"></span>
                                    <input id="cad" type="checkbox" name="workorder[affect][cad]" class="require-one"/>
                                    <label>Cad (John Doe [1])</label>
                                </li>
                                <li>
                                    <input id="design" type="checkbox" name="workorder[affect][design]" class="require-one" />
                                    <label>Design (John Doe [2])</label>
                                </li>
                                <li>
                                    <input id="shop" type="checkbox" name="workorder[affect][shop]" class="require-one" />
                                    <label>Shop (John Doe [3])</label>
                                </li>
                                <li>
                                    <input id="cnc" type="checkbox" name="workorder[affect][cnc]" class="require-one" />
                                    <label>CNC (John Doe [4])</label>
                                </li>
                                <li>
                                    <input type="checkbox"...

JavaScript

$('#work_direction').on('change' , function() {
    var direction = $(this).val();
    $('#'+direction).prop('checked', true);
});