.mouseout + setTimeout в .click, почему сразу после .click срабатывает событие .mouseout?
1. overlay внутри th
2. Исходя из кода внутренний блок убегает вниз на всю высоту родителяthisParent.addClass('th-active');
.th-active .overlay{
    transform:translateY(100%);
}Примечание
Попробуйте установить 50% и при первом клике держите курсор выше мнимой 50% линией, потом кликните ниже.
3. Открываем документациюThe mouseout event is fired when a pointing device (usually a mouse) is moved off the element that has the listener attached or off one of its children.
Пробуем перевести и оказывается, что событие зажигается не только при уходе с блока с классом th.Mouseout активируется, когда указатель мыши входит или выходит в/из дочерний(го) элемент(а), в то время как mouseleave  этого не делает.Интересное сравнение mouseout и mouseleaveВывод: используйте mouseleaveДополнение к комментарию
Насчет случая с hover в вашем примере нет ничего удивительного, если посмотреть исходники jqueryjQuery.fn.extend({
	hover: function( fnOver, fnOut ) {
		return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
	},
То есть mouseleave в любом случае получит обработчик, но при отсутствии fnOut вызовется повторно ваша первая функция.
сотый раз напишу
click - устаревший метод, используйте .on('click'....)