Advanced Search

Navigating/Traversing Elements With jQuery

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

Expand | Embed | Plain Text

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.