How to hide div with jQuery?

Question

When I want to hide the HTML <div> , I use the following JavaScript code:

 var div = document.getElementById('myDiv'); div.style.visibility = "hidden"; div.style.display = "none"; 

What is the equivalent of this code in jQuery?

Answer 1

 $('#myDiv').hide(); 

or

 $('#myDiv').slideUp(); 

or

 $('#myDiv').fadeOut(); 

Answer 2

Easily:

 $('#myDiv').hide(); 

http://api.jquery.com/hide/

Answer 3

 $("#myDiv").hide(); 

will set the css screen to none. if you also need to set visibility to hidden, you can do this through

 $("#myDiv").css("visibility", "hidden"); 

or combine both in a chain

 $("#myDiv").hide().css("visibility", "hidden"); 

or write everything with one css () function

 $("#myDiv").css({ display: "none", visibility: "hidden" }); 

Answer 4

If you want the element to retain its space, you need to use

 $('#myDiv').css('visibility','hidden') 

If you do not want the element to retain its space, you can use

 $('#myDiv').css('display','none') 

or simply,

 $('#myDiv').hide(); 

Answer 5

$("myDiv").hide(); and $("myDiv").show(); does not work in Internet Explorer.

The way I got around this is to get the contents of the html myDiv using .html() .

Then I wrote his newly created DIV. Then I attached the DIV to the body and added the contents of the Content variable to the HiddenField , then I read that content from the newly created div when I wanted to show the DIV.

After I used the .remove() method to get rid of the DIV that temporarily held my html DIVs.

 var Content = $('myDiv').html(); $('myDiv').empty(); var hiddenField = $("<input type='hidden' id='myDiv2'>"); $('body').append(hiddenField); HiddenField.val(Content); 

and then when I want to SHOW the contents again.

  var Content = $('myDiv'); Content.html($('#myDiv2').val()); $('#myDiv2').remove(); 

This was more reliable than the .hide() and .show() methods.

Answer 6

$('#myDiv').hide() will hide the div ...