Move Element Position OnClick - For Editing Paradigm

by bizamajig

HTML

<div id="container">
    <ul class="list">
        <li >first item</li>
        <li class="active">second item</li>
        <li>third item</li>
        <li >fourth item</li>
    </ul>
</div>   
<div class="nav">
    <a href="#" class="up">up</a>
    <a href="#" class="down">down</a>
</div>

CSS

.nav{
    top: 100px;
    position:absolute;
}
.list {
    position: absolute;
}

JavaScript

$('.up').click(function(){
    var newtop = $('.list').position().top - 20;
    $('.list').css('top', newtop + 'px');
});

$('.down').click(function(){
    var newtop = $('.list').position().top + 20;
    $('.list').css('top', newtop + 'px');
});