Navigating/Traversing Elements With jQuery


/ Published in: jQuery
Save to your folder(s)



Copy this code and paste it in your HTML
  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. $('.project a.button-open').click(function(){
  4. $(this).parents('.project:first').find('.project-nav').hide();
  5. return false;
  6. });
  7. });
  8. </script>
  9.  
  10. <div id="container">
  11. <br />
  12. <br />
  13. <br />
  14. <br />
  15. <div class="project">
  16. <p>hey 1</p>
  17. <div class="project-header">
  18. <p>hey</p>
  19. <a href="." class="button-open">Close<p>hey</p><p>hey</p><p>hey</p></a>
  20. </div> <!-- close .project-header -->
  21.  
  22. <ul class="project-nav">
  23. <li><p>hey project-nav</p></li>
  24. <li class="here"><a href=".">Add note</a></li>
  25. </ul> <!-- close .project-nav -->
  26. </div> <!-- close .project -->
  27. <br />
  28. <br />
  29. <br />
  30. <br />
  31. <div class="project">
  32. <div class="project-header">
  33. <a href="." class="button-open">Close<p>hey</p><p>hey</p><p>hey</p></a>
  34. </div> <!-- close .project-header -->
  35.  
  36. <ul class="project-nav">
  37. <li class="here"><a href=".">Add note</a></li>
  38. </ul> <!-- close .project-nav -->
  39. </div> <!-- close .project -->

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.