Toggling child elements on parent click

Hey folks,
i am new at JS and jQuery and trying to make this code work. But i can’t solve the problem. when u click on parent of nested list items.It hide the unordered list too. i tried to add siblings() method but still its not working like it should i.e parent of nested li should be visible to toggle its child again. Here is the code


$(document).ready(function(){
    $("li").has("ul li").click(function(){
        $(this).toggle()
    })
})


<ul>
<li>Home</li>
<li>About</li>
    <li>Folio
    <ul>
        <li>Photograph</li>
    </ul>
    </li>
</ul>

I assume what you are saying is that if you click on Folio you want to toggle the <UL> but keep Folio visible.

In which case you need

$(this).find("ul").toggle()

Ah, thanks a ton!