jQuery click slideUp not working

Question

$("#front").click(function () {
    $(this).slideUp();
});

and

<div class="a" id="front">
    <div class="b">
        <h1>...</h1>
        <p>..........</p>
    </div>
</div>

Is there anything wrong with this code? Because it does not work properly.

Answer 1

$(document).ready(function() {
  $("#front").click(function () {
    $(this).slideUp();
  });
});

Answer 2

What Chuck said.

$(document).ready(function() {
   $("#front").click(function () {
     $(this).slideUp();
  });
});

You can't bind a click on a div that might not exist yet <3

Answer 3

One thing that hasn't been mentioned is the callback function, it doesnt really apply here but for those of you who are having this issue and this doesnt solve it make sure you have nothing like a 'remove()' straight after. If you do, use:

$('#ele').slideUp(function(){
    $(this).remove();
});

Like I say, just in case :)