JSFiddle - React, Tailwind, and code Playground

HTML

<div class="moveable" id="div1">
    One
    <a href='#' class="up">Move up</a>
    <a href='#' class="down">Move down</a><br/>
</div>
<div class="moveable" id="div2">
    Two
    <a href='#' class="up">Move up</a>
    <a href='#' class="down">Move down</a><br/>
</div>
<div class="moveable" id="div3">
    Three
    <a href='#' class="up">Move up</a>
    <a href='#' class="down">Move down</a><br/>
</div>

CSS

.moveable{
    border:1px solid black;
    padding:5px 5px 5px 5px
}

JavaScript

$('.moveable a.up').live('click',function(){
    var $div = $(this).parent('.moveable');
    var idx = $div.index();
    if(idx>0){          
        $div.remove();
        $('div.moveable:eq(' + (idx-1) +')').before($div);
    }
    return false;
});
$('.moveable a.down').live('click',function(){
    var $div = $(this).parent('.moveable');
    var idx = $div.index();
    if(idx<$('div.moveable').length-1){         
        $div.remove();
        $('div.moveable:eq(' + idx +')').after($div);
    }
    return false;
});