Replace a div with another div every 30 seconds

My code:

<div class="employee">
<div class="text">Number of Employees</div>
<div class="number">50</div>
</div>

I want the below div, to replace the above div, every 30 seconds. i.e. Above div displays for 30 seconds, then the below div displays for 30 seconds, then back to the above div for 30 seconds, and so on....

<div class="recruit">
<div class="text">Recruiting</div>
<div class="number">1</div>
</div>

I know how to do this onclick -

$( ".employee" ).click(function() {
$( this ).replaceWith( "<div class="recruit"><div class="text">Recruiting</div><div class="number">1</div></div>" );
});

But I do not know how to automate this to change every 30 seconds?

Answers:

Answer

You can use:

setInterval(function(){
   if($('.employee').length)
      $('.employee').replaceWith( '<div class="recruit"><div class="text">Recruiting</div><div class="number">1</div></div>' );
    else
      $('.recruit').replaceWith( '<div class="employee"><div class="text">Number of Employees</div><div class="number">50</div></div>' );
},30000);

Working Demo with 3 seconds toggling

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.