Swap two elements in jQuery
You can do it like this - you need to check e.target not the div with class = move
jQuery('.move').children().click(function (e) { // <-- argument passed in is the event not an element
var $div = $(this).closest('.item'); // get closest item div
if (jQuery(e.target).is('.move-down')) { // check if clicked is movedown
$div.next('.item').after($div); // if it is move after next
} else {
$div.prev('.item').before($div);// else move it before previous
}
});
FIDDLE
I'd probably do something like this:
$(document).ready(function () {
$('.move-down').click(function (e) {
var self = $(this),
item = self.parents('div.item'),
swapWith = item.next();
item.before(swapWith.detach());
});
$('.move-up').click(function (e) {
var self = $(this),
item = self.parents('div.item'),
swapWith = item.prev();
item.after(swapWith.detach());
});
});
Here's a working example: http://jsfiddle.net/a6Se4/
try:
jQuery('.move > div').on('click', function(event) {
var item = jQuery(this).closest('div.item');
if(jQuery(this).hasClass('move-down')) {
item.prev('div.item').before(item);
} else {
item.next('div.item').after(item);
}
});