Show and hide div onclick button

javascript jquery button hide show
Zoker picture Zoker · Dec 11, 2013 · Viewed 49.5k times · Source

How can I show and hide a div (content) with a click on a button?

Here some code:

<button class="btn btn-default">Text</button>
<div class="div-to-hide">Some content</div>

Answer

cantonic picture cantonic · Dec 12, 2013

You can do this by using jQuery's toggle function like <button class="button" onclick="$('#target').toggle();">Show/Hide</button>

Here is a working example: http://jsfiddle.net/W2vh3/

Related questions

Get the contents of a table row with a button click

I need to extract the details of each column in my table. For example, column "Name/Nr.". The table contains a number of addresses The very last column of each row has a button that lets a user choose a …

Read More
Best way to disable button in Twitter's Bootstrap

I am confused when it comes to disabling a <button>, <input> or an <a> element with classes: .btn or .btn-primary, with JavaScript/jQuery. I have used a following snippet to do that: $('button').addClass(…

Read More
jQuery input button click event listener

Brand new to jQuery. I was trying to set up an event listener for the following control on my page which when clicked would display an alert: <input type="button" id="filter" name="filter" value="Filter" /> But it …

Read More