Is there a way in jQuery to bring a div to front?

This is a CSS thing, not a jQuery thing (though you can use jQuery to modify the css).

$('element').css('z-index', 9999);  // note: it appears 'zIndex' no longer works

Or, absolute positioning will bring something to the top:

$('element').css('position', 'absolute');

With jQuery (like you asked):

$('#a-div').parent().append($('#a-div')); // Pop a div to the front

Weird how everyone went with z-index. Why override natural stacking order when you can just pop it to the front within the DOM?

When you are working with multiple elements you'll have to loop through and see which has the highest z-index, and set the top to that+1.

http://jsfiddle.net/forresto/Txh7R/

var topZ = 0;
$('.class-to-check').each(function(){
  var thisZ = parseInt($(this).css('zIndex'), 10);
  if (thisZ > topZ){
    topZ = thisZ;
  }
});
$('.clicked-element').css('zIndex', topZ+1);

---

For a non-CSS version (if none of the layers have z-index specified) you can also just append the element again:

$('.click-to-top').click(function(){
  $(this).parent().append(this);
});

(I don't know if that is slower than with CSS z-index.)

For non-CSS non-jQuery, just append it again:

// var element = document...;
element.parentNode.appendChild(element);