title: Display Data one at a time using Jquery
body: <p>I need to display data one at a time but my code is displaying the data all at once, what am I missing ?
  Here is my HTML/PHP CODE</p>
  
  <pre><code>&lt;div style="position: relative;"&gt;
      &lt;?php for ($i=1; $i &lt; 1000; $i++) { 
      ?&gt;
      &lt;p id="&lt;?php echo $i; ?&gt;" style="position: absolute; display:none; "&gt;Name &lt;?php echo $i; ?&gt;&lt;/p&gt;
      &lt;?php   
      }
      ?&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And here is my Javascript Code</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function(){
      var count;
      $(".btn2").click(function(){
          for(count = 0; count &lt; 1000; count++){
              $("#"+count).show();
              setTimeout(function() { $("#"+count).hide(); }, 500);
          }
  
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>I'm using jquery version 3.2.1</p>
  
  <pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"&gt;&lt;/script&gt;
  </code></pre>