How to I hide and show HTML elements using JQuery?

Question

How to I hide and show HTML elements using JQuery without any special effects?

Answer 1

Using the hide() and show() methods:

$("selector").hide();
$("selector").show();

Where "selector" is whatever is appropriate. Like:

<script type="text/javascript">
$(function() {
  $("#mybutton").click(function() {
    $("#mydiv").toggle();
  });
});
</script>
<div id="mydiv">
This is some text
</div>
<input type="button" id="mybutton" value="Toggle Div">

The toggle() method just calls show() if hidden or hide() if its not.

Answer 2

$('#someElement').show(); //an element with id of someElement

$('.someElement').hide();  //hide elements with class of someElement

$('a').hide(); //hide all anchor elements on the page

See:

http://docs.jquery.com/Effects/show

and

http://docs.jquery.com/Effects/hide

Also, would be a good idea to read up on Selectors:

http://docs.jquery.com/Selectors