Как добавить класс и через секунду заменить на другой?

Question

[IJIL]

К примеру блок:

<div id="element">

</div>
<button class="open">open</button>
<button class="close">close</button>

Мне необходимо, в первые с таким столкнулся, при нажатии кнопки Open добавить к #element класс show через секунду заменить show на opened . Если жмем кнопку закрыть close то меняем сразу класс opened на hide через 0.5 секунды убрать и hide
Буду благодарен если подскажите как сделать второе действие выше если нажать мышкой или пальцем вне #element тоесть просто закрыть его в том же порядке

Answer 1

[Даниил Сорокин]

setTimeout(function(){
$('#element').removeClass('show').addClass('opened');
},1000)

Comments

[DireX]

Никита Полевой: Снимаю шляпу... проморгал

[Kovalsky]

DireX: ничо) Раз вы коммент удалили, я тоже удаляюсь

Answer 2

[DireX]

$('.open').on('click', function(){
   var open = setInterval(function(){
     $('#element').removeClass('opened').addClass('show');
     clearInterval(open);
   }, 1000);
});

$('.close').on('click', function(){
     var close = setInterval(function(){
     $('#element').removeClass('show').addClass('opened');
     clearInterval(close);
   }, 500);
});