Link to home
Start Free TrialLog in
Avatar of earwig75
earwig75

asked on

Toggle a div with a button and timer with jQuery

I am using the below to toggle a div with jQuery. I would like to make it so that after the initial button click/toggle happens, after 5 seconds, it runs once again by itself to show "Div 1" again... and then stops. Could someone assist?

//HTML
<div class="myDiv ">Div 1</div>
<div class="myDiv hidden">Div 2</div>
<input type="button" value="Toggle Me" id="toggle">

//jQuery
$('#toggle').click(function() {
   $('.myDiv').toggleClass('hidden');
});

//CSS
.hidden {display: none; }

Open in new window

Avatar of HainKurt
HainKurt
Flag of Canada image

https://jsfiddle.net/zd7kf636/

$('#toggle').click(function() {
  $('.myDiv').toggleClass('hidden');
  $('#toggle').hide();
  setTimeout(function() {
    $('#toggle').show();
  }, 5000);
});

Open in new window

Avatar of earwig75
earwig75

ASKER

@Huseyin, that Does not show Div 1 again after 5 seconds, it continues to show Div 2.
ASKER CERTIFIED SOLUTION
Avatar of HainKurt
HainKurt
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Perfect thank you.