how can I get 3 data in cycle with jquery - php

Question

I have a website which is using the CodeIgniter framework. In my one page I should get some data and list them. and I don't want to use the scrollbar on this page.
how can I get 3 data in cycle with jquery?
This code is getting just 1 data in cycle but I want to get 3 data in the cycle.
<ul class="list">
<?php foreach ($a_list as $hd) { ?>
<div id="content-1">
<a href="single.html">
<li>
<section class="list-left" style="border:0px solid red; width:30%; height:90px;">
<section class="list" style="border-bottom:1px solid red; width:100%; margin-top: 0; text-align: center">
<h6 class="title" >Hasta</h6>
</section>
<p class="adprice" style="color:black; text-align: center; font-size: -5;"><?= $hd->h_adi ?> <?= $hd->h_soyadi ?>
</section>
<section class="list-left"style="border:0px solid red; width:30%; height: 90px">
<section class="list" style="border-bottom:1px solid red; width:100%; margin-top: 0; text-align: center">
<h5 class="title" >Doktor</h5>
</section>
<p class="adprice" style="text-align: center">
<?= $hd->a_unvan ?>
<?= $hd->dr_adi ?>
<?= $hd->dr_sadi ?>
<br>
<p class=catpath style="text-align: center; margin-top: 0px !important; color:black">
<?=$hd->a_brans?>
Uzmanı
</p>
</p>
</section>
<section class="list-left" style="border:0px solid red; width:30%;height: 90px">
<section class="list" style="border-bottom:1px solid red; width:100%; margin-top: 0; text-align: center">
<h5 class="title" >Durum</h5>
</section>
<p class="adprice" style="color:blue;text-align: center"><?=$hd->h_durum?></p>
</section>
<div class="clearfix"></div>
</li>
</a>
</div>
<?php } ?>
<script src='<?=base_url()?>/assets/js/jquery.min.js'></script>
<script>
var divs = $('div[id^="content-"]').hide(),
i = 0;
(function cycle() {
divs.eq(i).fadeIn(400)
.delay(1000)
.fadeOut(400, cycle);
i = ++i % divs.length;
})();
</script>
<a href="single.html">
</a>
</ul>
zxcf