JSFiddle - React, Tailwind, and code Playground

by eddiriarte

HTML

<link rel="stylesheet" href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css">
<div class="container">
    <div class="row-fluid">
        <ul id="list1" class="nav nav-pills nav-stacked connectedSortable">
            <li><a href="#"><i class="icon-cog"></i> Item1</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Item2</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Item3</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Item4</a>

            </li>
        </ul>
    </div>
    <div class="row-fluid">
        <ul id="list2" class="nav nav-tabs nav-stacked connectedSortable">
            <li><a href="#"><i class="icon-cog"></i> Echo1</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Echo2</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Echo3</a>

            </li>
            <li><a href="#"><i class="icon-cog"></i> Echo4</a>

            </li>
        </ul>
    </div>
</div>

JavaScript

$(function () {
    $("#list1, #list2").sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
});