Sanjeev K Sanjeev K - 1 month ago 6
CSS Question

Slidetoggle not working properly when within LI

I am trying to show/hide

div
on click with
slidetoggle
, its working properly but when I click on
input
, its still showing/hiding, how do I make it working only on
LI
not on inner elements.

Here is the working JSfiddle Demo

Limitation I have is I can't bring that
div
out of
LI
as currently its within
LI
tag

Here is the function I have created for that:

$('#location').click(function(){
$(".location_contents").slideToggle(600);
$(".header_right > ul > li:nth-child(1)").toggleClass('actbtn');
});

Answer

If you will trigger function while clicking parent div, it also will trigger when child is clicked, you can use immediate child selector,

$('#location > a').click(function(){
        $(".location_contents").slideToggle(600);
        $(".header_right > ul > li:nth-child(1)").toggleClass('actbtn');
});
Comments