I have 3 different HTML divs as shown below:
HTML
<div id="one" class="hide">Text one</div>
<div id="two" >Text two</div>
<div id="three" class="hide">Text three</div>
I am looking to use jQuery to dynamically change the CSS of these divs at regular intervals. Here is an example of how I want it to behave:
JS
// First N seconds :
$("#two").hide();
$("#one").show();
//Next N seconds:
$("#one").hide();
$("#three").show();
//Next N seconds:
$("#three").hide();
$("#two").show();
The cycle should then repeat, switching between the divs in this pattern.
I have attempted using setInterval, but so far I haven't been able to make it work smoothly without skipping actions.
Instead of relying on checking the visibility of divs through CSS classes, I am seeking a method that will allow me to switch between the divs based on the IDs provided in an array. For instance:
idArray=["one", "two", "three"];