selector within local scope
Not sure how this can be done in jquery, need help... Let me explain the question using an example:
- <html>
- <head>
- <script type="text/javascript" src="jquery-1.4.2.js"></script>
- <script type="text/javascript">
- $(document).ready(function() {
- $("#span1").click(function() {
- alert($("img:eq(1)").attr("alt"));
- });
- });
- </script>
- </head>
- <body>
- <div id="div1">
- <span id="span1">ABC</span>
- <img src="1.jpg" width="100" height="100" alt="pic1" id="img1">
- </div>
- <img src="2.jpg" width="100" height="100" alt="pic2">
- </body>
- </html>
If you run it, the alert message is "pic2", so jquery sees the entire document, but is there a way to easily restrict it to the sub-tree under the current node (in this case the sub-tree under the span node, since that's what was clicked)? Yes, I can do something like
- alert($("#div1 img:eq(1)").attr("alt")); //undefined as expected
But I am looking for a solution that's more dynamic, so I don't need to hard code #div1.