JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<h3>Feature should work after a second</h3>

<div class="container">
    <table class="table table-striped table-condensed">
        <thead>
            <th></th>
            <th>Col 1</th>
            <th>Col 2</th>
        </thead>
        <tbody>
            <tr>
                <td><input type="checkbox" value="1" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="2" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="3" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="4" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="5" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="6" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="7" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="8" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
                <td><input type="checkbox" value="9" /></td>
                <td>Col 1 data</td>
                <td>Col 2 data</td>
            </tr>
            <tr>
  ...

JavaScript

// Load the script from github (jsfiddle doesn't like text/plain as an external res)
$.getScript('https://raw.github.com/aleximplode/dragcheck/master/dragcheck.js', function() {
    // Wait a sec to make sure it has finished loading
    setTimeout(function() {
        $('h3').text('It should work now');
        
        // Setup the check stuff on the table body
        $('table tbody').dragcheck({
            // Using the tr as a container
            container: 'tr',
            
            // The main part of all of this
            // In this case, I only want to process the select event if the value is changing
            // Show a log message
            // Change the state using $.fn.prop (jquery 1.6+)
            // You can also use $.fn.attr in jquery 1.7- I believe but in newer versions 
            //     it must be $.fn.prop
            onSelect: function($obj, state) {
                if($obj.is(':checked') != state) {
                    $('#log').prepend('Check: ' + $obj.val() + ' ' + state + '<br />');
                    $obj.prop('checked', state);
                    
                    // Toggle class, note that regular clicks aren't currently affected
                    if(state) {
                        $obj.parents('tr').addClass('info', 'slow');
                    }
                    else {
                        $obj.parents('tr').removeClass('info', 'slow');                        
                    }
                }
            }
        });
    }, 1000);
});