Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 668
  • Last Modified:

jQuery: Find matching children but not matching grandchildren

Using jQuery, how can I select matching children but not matching grandchildren?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Examples</title>
<style type="text/css">
li {
cursor: pointer;
}

ul ul {
display: none;
}

</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function () {
 $('li').click(function () {
  $(this).find('ul').show()
 });
});

</script>

</head>
<body>
When you click on "Vegitation" only "Fruit" and "Vegies" should be shown. "Apple" and "Peas" should not be shown.
 <ul>
  <li>Vegitation
   <ul>
    <li>Fruit
     <ul>
      <li>Apple</li>
      <li>Peach</li>
      <li>Pear</li>
     </ul>
    <li>Vegies
     <ul>
      <li>Spinich</li>
      <li>Peas</li>
     </ul>
    </li>
   </ul>
  </li>
 </ul>

</body>
</html>

Open in new window

0
hankknight
Asked:
hankknight
1 Solution
 
Snarf0001Commented:
Use .children instead of .find

$(this).children('ul').show()
0
 
leakim971PluritechnicianCommented:
Your HTML is malformed, there's a missing </li>

When you click on "Vegitation" only "Fruit" and "Vegies" should be shown. "Apple" and "Peas" should not be shown.
<ul>
    <li>Vegitation
        <ul>
            <li>Fruit
                <ul>
                    <li>Apple</li>
                    <li>Peach</li>
                    <li>Pear</li>
                </ul>
            </li>
            <li>Vegies
                <ul>
                    <li>Spinich</li>
                    <li>Peas</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now