Div появляются onclick, исчезают onclick

Question

 $(function() { 
  $('.dropTitle').click(function() { 
    $('.columnCenter ul ul').css('display', 'block'); 
  }); 
                               
}); 

У меня есть функция щелчка здесь. Когда я нажимаю .dropTitle, .columnCenter ul ul отображает «блок». Как я могу получить его, когда я снова нажму .dropTitle, он переключится на отображение: none ;?

Я хочу иметь возможность переключаться между дисплеем: блок для отображения: нет при нажатии .dropTitle.

Вся помощь будет оценена, спасибо!

Answer 1

Просто используйте toggle:

$(function() { 
    $('.dropTitle').click(function() { 
     $('.columnCenter ul ul').toggle(); 
    });       
}); 

Working example.

Answer 2

это, вероятно, будет проще использовать вспомогательный класс здесь, например:

.is--hidden { 
    display: none; 
}   

, а затем переключаться, что класс по клику:

$('.dropTitle').click(function() { 
    $(this).toggleClass('is--hidden') 
} 

Answer 3

я бы использовать не только .toggle(), но я хотел бы использовать .on(), а также ...

$(function() { 
    $(document).on('click', '.droptitle', function() { 
     $('.columnCenter ul ul').toggle(); 
    });       
});