Quiero repetir el nombre de clase 'mover' sobre todos los divs, por lo que si el primer div tiene el nombre de clase 'mover', quiero eliminarlo y luego agregarlo al siguiente elemento cada tres segundos.
$(document).ready(function () { setInterval(swapUsp, 3000); function swapUsp() { var active = $('#infobarContainer .uspTag'); var next = ($('#infobarContainer .uspTag').next().length > 0) ? $('#infobarContainer .uspTag').next() : $('#infobarContainer .uspTag:first'); if (active.hasClass('move')) { active.removeClass('move') next.addClass('move'); } } }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class ="infobarContainer"> <div class="uspTag tagline tagline2 move"> USP 1 </div> <div class="uspTag tagline tagline2"> USP 2 </div> <div class="uspTag tagline tagline2"> USP 3 </div> <div class="uspTag tagline tagline2"> USP 4 </div> </div>Puede cambiar su función lista para
$(document).ready(function () { setInterval(swapUsp, 3000); function swapUsp() { var active = $('#infobarContainer .uspTag.move').first(); var next = ($('#infobarContainer .uspTag.move').next().length > 0) ? $('#infobarContainer .uspTag.move').next() : $('#infobarContainer .uspTag:first'); active.removeClass('move') next.addClass('move'); } });Aquí hay uno con menos consultas DOM
const startAnimation = (time) => { let counter = 0; const elements = $('.uspTag'); const update = () => { const index = counter % elements.length; const previousIndex = ++counter % elements.length; $(elements[index]).toggleClass('move'); $(elements[previousIndex]).toggleClass('move'); } setInterval(update, 3000); } startAnimation(3000) const divs=[...document.querySelectorAll(".tagline2")]; divs.i=0; setInterval(function(){ divs[divs.i++].classList.remove("move"); divs[divs.i=divs.i%divs.length].classList.add("move") },500); .move {background-color:red} <div class="infobarContainer"> <div class="uspTag tagline tagline2 move"> USP 1 </div> <div class="uspTag tagline tagline2"> USP 2 </div> <div class="uspTag tagline tagline2"> USP 3 </div> <div class="uspTag tagline tagline2"> USP 4 </div> </div>