Search code examples
togglebutton

My button is showing div, but how to hide div after second click?


Okay. So I've done button which shows four more items (divs). Can somebody help me how to toggle this button? I want hide this four items by clicking for the second time on the same button. Here is code:

<script type="text/javascript">
function showDiv() {
    document.getElementById('four-more-portfolio-items').style.display = "block";}
</script>

And HTML:

<div id="four-more-portfolio-items" style="display: none;">
......
......
......
</div>

Solution

  • You can use jQuery toggle() method for this task.

    $("#button_id").click(function() {
        $("#four-more-portfolio-items").toggle();
    });
    

    See http://api.jquery.com/toggle/