title: How to show more content using array slice in JavaScript?
body: <p>I am pretty new in JavaScript. I am trying to make a show more button using a javascript array slice. I want to target the next 3 div when a user clicks on the button. Every time he clicks on the button next 3 div will be visible to him</p>
  
  <pre><code>&lt;button onclick="myFunction()"&gt;Show More&lt;/button&gt;
  &lt;p id="demo"&gt;one&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;two&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;three&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;four&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;five&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;six&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;seven&lt;/p&gt;
  &lt;p id="demo" style="display:none;"&gt;eight&lt;/p&gt;
  </code></pre>
  
  <p>JavaScript</p>
  
  <pre><code>function myFunction() {
    var slice = [];
    slice[0] = document.getElementById("demo");
    var citrus = slice[0].slice(0, 3);
    citrus.style.display = "block";
  }
  </code></pre>
  
  <p>I want to make this in pure JavaScript. I know this is very begginer level question but please help me to do this thing.</p>