addClass working, toggleClass not

addClass working, toggleClass not

I have a p element that opens a info box on click. This info box can then be closed by two links within the box itself.

This is my html:
  1. <p class="link"></p>
    <div class="box hidden">
        <a class="close">[...]</a>
        <div>[...]</div>
        <a class="close-link">[...]</a>   
    </div>




   
And this my js:

  1.     <script type="text/javascript">
            jQuery(".link").click(function(){
                jQuery(this).next("div").addClass("hidden");
            });
            jQuery(".close-link").click(function(){
                jQuery(this).parent("div").addClass("hidden");
            });
            jQuery(".close").click(function(){
                jQuery(this).parent("div").addClass("hidden");
            });
        </script>









   
Which is working great, however I would like to allow my visitors to close the box by clicking the p element again. I was hoping, simply replacing jQuery(this).next("div").addClass("hidden"); with jQuery(this).next("div").toggleClass("hidden"); would work but for some reason it isn't. What am I doing wrong or is there another (better) approach?
Thanks!