jQuery UI Current

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>

<div class="test" id="foo_parent">
      <div class="test" id="foo_0_0">One 1</div>
      <div class="test" id="foo_0_1">One 2</div>
      <div class="test" id="foo_0_2">One 3</div>
      <div class="test" id="foo_0_3">One 4</div>
      <div class="test" id="foo_0_4">One 5</div>
  </div>

  <div class="test" id="bar_parent">    
      <div class="test" id="bar_0_0">Two 1</div>
      <div class="test" id="bar_0_1">Two 2</div>
      <div class="test" id="bar_0_2">Two 3</div>
      <div class="test" id="bar_0_3">Two 4</div>
      <div class="test" id="bar_0_4">Two 5</div>
  </div>
  
  <div class="test" id="baz_parent">  
      <div class="test" id="baz_0_0">Three 1</div>
      <div class="test" id="baz_0_1">Three 2</div>
      <div class="test" id="baz_0_2">Three 3</div>
      <div class="test" id="baz_0_3">Three 4</div>
      <div class="test" id="baz_0_4">Three 5</div>
  </div>

CSS

.test {
      border: 1px solid red;
      margin: 5px;
      padding: 5px;
    }

JavaScript

$('.test').sortable({
    connectWith: '.test'
});
$('.test').disableSelection();