JSFiddle - React, Tailwind, and code Playground

by trevor_davis

HTML

<form>
    <ul>
        <li><a href="#">Something</a> <input type="checkbox" name="" id="" /></li>
        <li><a href="#">Something</a> <input type="checkbox" name="" id="" /></li>
    </ul>
</form>

JavaScript

$(document).ready(function() {
    $('input').each(function() {
        $(this).attr('disabled', 'disabled');
    });

    $('a').bind('click', function(e) {
        var $input = $(this).siblings();

        if($input.attr('checked') === 'checked') {
            $input.removeAttr('checked');
        } else {
            $input.attr('checked', 'checked');
        }

        e.preventDefault();
    });

    $('a').bind('keydown', function(e) {
        if(e.keyCode === 32) {
            $(this).trigger('click');
            e.preventDefault();
        }
    });
});