Menu
Hopefully this is an easy question. I have a div that I want to toggle hidden/shown with a button
<div id="newpost"> 
236
To show and hide div on mouse click using jQuery, use the toggle() method. On mouse click, the div is visible and on again clicking the div, it hides.
You need to make sure the target div has an ID. Bootstrap has a class "collapse", this will hide your block by default. If you want your div to be collapsible AND be shown by default you need to add "in" class to the collapse. Otherwise the toggle behavior will not work properly.
Pure JavaScript:
var button = document.getElementById('button'); // Assumes element with id='button' button.onclick = function() { var div = document.getElementById('newpost'); if (div.style.display !== 'none') { div.style.display = 'none'; } else { div.style.display = 'block'; } }; jQuery:
$("#button").click(function() { // assumes element with id='button' $("#newpost").toggle(); }); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
