jquery toggle multiple id
<p>I found a sample program from w3school, and I manage to edit it. but the problem is, it is too consuming of codes, what I want is a short version of this code. Is it possible?
(I tried to put the div in php include,I use a single toggle function and multiple button but once I click a button all the div show).</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"&gt;&lt;/script&gt;
&lt;script&gt;
$(document).ready(function(){
    $("#p1").hide();
    $("#p2").hide();
    $("#p3").hide();
    $("#p4").hide();

$("#button1").click(function(){
        $("#p1").toggle();
    });
$("#button2").click(function(){
        $("#p2").toggle();
    });
$("#button3").click(function(){
        $("#p3").toggle();
    });
$("#button4").click(function(){
        $("#p4").toggle();
    });
});
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div id="p1"&gt;

&lt;p&gt;This is a paragraph with little content.&lt;/p&gt;
&lt;p&gt;This is another small paragraph.&lt;/p&gt;

&lt;/div&gt;
&lt;button id="button1"&gt;Toggle&lt;/button&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;

&lt;div id="p2"&gt;

&lt;p&gt;This is a paragraph with little content.&lt;/p&gt;
&lt;p&gt;This is another small paragraph.&lt;/p&gt;

&lt;/div&gt;
&lt;button id="button2"&gt;Toggle&lt;/button&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;

&lt;div id="p3"&gt;

&lt;p&gt;This is a paragraph with little content.&lt;/p&gt;
&lt;p&gt;This is another small paragraph.&lt;/p&gt;

&lt;/div&gt;
&lt;button id="button3"&gt;Toggle&lt;/button&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;

&lt;div id="p4"&gt;

&lt;p&gt;This is a paragraph with little content.&lt;/p&gt;
&lt;p&gt;This is another small paragraph.&lt;/p&gt;

&lt;/div&gt;
&lt;button id="button4"&gt;Toggle&lt;/button&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;

&lt;/body&gt;
&lt;/html&gt;
</code></pre>