Drag and drop elems with jQuery + jQuery UI

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title><!-- Title here --></title>
    <link data-require="jqueryui" data-semver="1.10.0" rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.0/css/smoothness/jquery-ui-1.10.0.custom.min.css" />
    <link rel="stylesheet" href="style.css" />
    <script data-require="jquery" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script data-require="jqueryui" data-semver="1.10.0" src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.0/jquery-ui.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <div class="dragdiv">1</div>
<div class="dragdiv">2</div>
<div class="dragdiv">3</div>
<div class="dragdiv">4</div>
<div class="dragdiv">5</div>
  </body>

</html>

// Add your javascript here
$(document).ready(function() {
    
    $(".dragdiv").draggable({
            revert: "invalid",
            cursor: "move",
            helper: "clone"
        });
    
    $(".dragdiv").droppable({
            drop: function(event, ui) {
                var $dragElem = $(ui.draggable).clone().replaceAll(this);
                $(this).replaceAll(ui.draggable);
                makeElementAsDragAndDrop(this);
                makeElementAsDragAndDrop($dragElem);
            }
        });

    function makeElementAsDragAndDrop(elem) {
        $(elem).draggable({
            revert: "invalid",
            cursor: "move",
            helper: "clone"
        });
        $(elem).droppable({
            drop: function(event, ui) {
                var $dragElem = $(ui.draggable).clone().replaceAll(this);
                $(this).replaceAll(ui.draggable);
                makeElementAsDragAndDrop(this);
                makeElementAsDragAndDrop($dragElem);
            }
        });
    }
});

/* Put your css in here */

.dragdiv
{
    width:100px;
    height:100px;
    text-align:center;
    border:1px solid gray;
    margin-left:2px;
    margin-top:2px;
    float:left;
}