Почему наведение и щелчок не всегда работают?

Question

здесь my fiddle

Довольно много работает отлично, кроме иногда MouseEnter, MouseLeave, нажмите функцию (.item) не всегда работает - и необходимо нажать для того, чтобы снова начать работать? почему это - вот мой код -

 $(document).ready(function() { 
    $('.timelineTile').click(function (evt) { 
     evt.stopPropagation(); 
    $('.timelineTile').not(this).removeClass('clicked').find('.pull_down_content').height(0); 
     $(this).toggleClass('clicked'); 

    if(!$('.timelineTile').hasClass("clicked")){ 
    $(this).children('.pull_down_content').height(0); 

     } 


     }); }); 

    $(document).click(function() { 
    $('.timelineTile').removeClass('clicked'); 
    $('.pull_down_content').height(0); 
    $('.inner').stop().css({'display': 'none'}, 300); 
    }); 


     $(document).ready(function() { 
    $('.timelineTile').children('.item').on('mouseenter mouseleave click', function(e) {  e.stopPropagation(); 
    if ($(this).parent('.timelineTile').hasClass("clicked")) { 
    if (!$(this).data('clicked')) { 
     var Height = e.type==='mouseenter' ? '90px' : e.type==='click' ? '250px' : '0px'; 
     $(this).siblings('.pull_down_content').stop().animate({'height': Height}, 300); 

     $(this).siblings('.pull_down_content').children('.inner').css({'display': 'block'}, 300); 

     if (e.type==='click') $(this).data('clicked', true); 
    }else{ 
     if (e.type==='click') { 
      $(this).data('clicked', false); 
      $(this).siblings('.pull_down_content').stop().animate({'height': '0px'}, 300); 
    $(this).siblings('.pull_down_content').children('.inner').css({'display': 'none'}, 300);   

     } 
    } 

    } 
       }); 


    }); 

Я не уверен, что это с этим связано?

if(!$('.timelineTile').hasClass("clicked")){ 
    $(this).children('.pull_down_content').height(0); 

     } 

Answer 1

Попробуйте заменить

$('.timelineTile').not(this).removeClass('clicked').find('.pull_down_content').‌​height(0); 

с этим

$('.timelineTile').not(this).removeClass('clicked').find('.pull_down_content').‌​height(0).end().find('.item').data('clicked',false); 

Answer 2

Может быть, вы пытаетесь прикрепить события, когда элементы не существует (например, если они будут добавлены динамически скрипты).

Используйте более современный случай «на» вместо «нажмите» и т.д.

$(wrapper).on('click', 'element', function() { ... }); 

SMTH как:

... 
<div class="wrapper"> 
    <span class="link">Click me</span> 
</div> 
... 
$('.wrapper').on('click', '.link', function() { ... }); 

Этот вариант добавляет события для всех элементов, даже если они добавлены динамически.