Consider this snippet of code
<ul class='target'>
<li><a>zero</a></li>
<li><a>one</a></li>
<li><a>two</a></li>
<li><a>three</a></li>
</ul>
<ul class='target'>
<li><a>zero</a></li>
<li><a>one</a></li>
<li><a>two</a></li>
<li><a>three</a></li>
</ul>
<ul class='target'>
<li><a>zero</a></li>
<li><a>one</a></li>
<li><a>two</a></li>
<li><a>three</a></li>
</ul>
Here is the accompanying JavaScript:
$('ul.target li a').on('click', function() {
var index = $(this).parent().index();
alert(index);
return false;
});
When clicking on an "a" element inside a "li", you will receive the index. However, how can you obtain the index of the middle (second) "ul" when clicking on the third "li" within the third "ul"? Is there a way to retrieve a different index other than the one clicked on?
EDIT
HTML code in the main file:
// Script details here
Within ajax.php:
// PHP script details here
Let me clarify again:
- In the main file, there is a table where clicks on "a" elements inside "td" within "tr.me_pega" are captured and sent to ajax.php.
- In ajax.php, a comprehensive response including additional JavaScript is sent back to be loaded into a predefined "td" within "tr.me_pega" (which can contain multiple instances).
- Back in the main file, after receiving the response from ajax.php, attempts are made to capture the parent index of "tr.me_pega" containing the "td" with a "select" element with values. If this explanation is confusing, please let me know.