Jquery .show() not revealing a div with visibility of hidden

Question

Basic jQuery question:

I am trying to reveal a div that has been marked as hidden using jQuery. But am not quite getting it

I've created a JSFiddle here: http://jsfiddle.net/VwjxJ/

Basically, I want to use style="visibility: hidden;" rather than style="display: none;" as I want the space of the hidden element to be maintained

Have tried using show(), fadeIn() etc but neither work (they do for style="display: none;")

what am I doing wrong?

Answer 1

If you have hidden it with visibility:hidden then you can show it with jQuery by

$(".Deposit").css('visibility', 'visible'); 

And in the fiddle you are missing jQuery. Here is a demo: http://jsfiddle.net/9Z6nt/20/

Answer 2

According to JQuery documentation .show() "is roughly equivalent to calling .css('display', 'block'), except that the display property is restored to whatever it was initially." Set the style explicitly instead. You could use a CSS class

.hidden{     visibility: hidden; } .shown{     visibility: visible; } 

and set is using

$("#yourdiv").removeClass("hidden").addClass("shown");