I want to fadeOut the first div in a collection and then fadeIn the next div. The fade in out would trigger at a set time. The number of items in the collection is 1 to n. Here is an example of the html;
<div class="contentPanel">
<div class="
content">
<div style="border: solid 2px black; text-align: center">
This is first
content
</div>
</div>
<div class="
content">
<div style="border: solid 2px black; text-align: center">
This is second
content
</div>
</div>
<div class="
content">
<div style="border: solid 2px black; text-align: center">
This is third
content
</div>
</div>
</div>
So on page load the first "
content" class would be visible, after x amount of time, the current "
content" would fadeout and the next "
content" would fade in. When it got to the nth "
content" it would start over, fadeout the nth "
content" and fadein the first "
content". This behavior would loop continuously.
