用另一个div切换一个div

Question

i am trying to make a div toggle another div which appears underneath it.

I have managed to do this with a button, however i was wondering if you could do this with another div, so that when you clicked anywhere inside the div, it would make the other div appear and disappear etc...

Here are the two divs i have

//This div is the one you click on
      <div id="more_toggle"></div><!---end more_toggle--->

//This div is the one that appears and disappears through the toggle        
      <div id="more_info">hello</div><!---end more_info--->

This is the script i use to toggle the divs through buttons, but it doesn't work with another div

$(function(){    
    $("#server_status_button").click(function(event){
        event.preventDefault();
        $("#status1").slideToggle();
    });    
});

Thanks for any help

Answer 1

$("#more_toggle").click(function(event) {
    $("#more_info").slideToggle();
});​

jsFiddle example

Answer 2

Have you tried:

$(function() {
    $('#more_toggle').click(function(e) {
          $('#more_info').slideToggle();
    });
});

If you want to hide use display toggling just try .toggle() instead of .slideToggle().

Answer 3

$('#more_toggle').click(function(){
    $('#more_info').slideToggle(); 
});