title: Mysql result show in php loop
body: <p>I am trying to get the result from "headline" and "content" to show up one at a time and then fade in and out to the next result in a loop. Currently, it shows all the results at once and the fades in and out and then show all the results again. Any idea on how to get them to show one at a time TIA</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
      &lt;style&gt;
          #table1{/*table aspects and design */
          border:1px solid #FFFFFF;
          background:#FFFFFF;
          display:none;
          width: 60%;
          margin-left: auto;
          margin-right: auto;
      }
  
      th{/*align table headers*/
          text-align:center;
      }
      td,th{
          border:1px solid #FFFFFF;
          text-align:center;
      }
  &lt;/style&gt;
  &lt;/head&gt;
  
   &lt;table id="table1" cellpadding="5" cellspacing="1" width="50%"&gt;
      &lt;? if ($query=$pdo-&gt;prepare("SELECT * FROM `Announcements_Current`"))
       {
  /* select all information from the table and take it into the page  */
      $query-&gt;execute(); 
      while ($result = $query-&gt;fetch(PDO::FETCH_ASSOC)){
          $head = $result['headline'];/*puts result of headline from table into variable*/
          $content = $result['content'];
          /*puts result of content from  table into variable*/
          echo /* echo the table to display announcements*/'
          &lt;tr&gt;
              &lt;th&gt;
                  &lt;h1&gt;
                      '.$head.'
                  &lt;/h1&gt;
              &lt;/th&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;font size="4"&gt;
                  '.$content.'
              &lt;/font&gt;
          &lt;/td&gt;
      &lt;/tr&gt;';
  
   }
  }
  ?&gt;
  &lt;/table&gt; &lt;!--end of table--&gt;
  &lt;script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  /* define script for jquery*/
  for (var i = 0; i &lt; 500; i++) {/* for loop to fade in and out the announcements*/
  
  $(document).ready(function() {/*function to fade table in and out*/
  $('#table1').fadeIn(2000);
  $('#table1').delay(5000);
  $('#table1').fadeOut(2000);
  }  
  )};
  &lt;/script&gt; 
  </code></pre>