Home/ Questions/Q 1105321
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-17T01:36:49+00:00

I have this html page which globally exists of div , section , and

  • 0

I have this html page which globally exists of div, section, and ul elements (of course some more, but those are the most common)

Now in my fourth list on the page (e.g. below in bold)


<body>
 <div>
  <header>
   <ul id="firstList">
    <li>
    [..]
  <section>
   <ul id="secondList">
    [..]
  <section>
   <ul id="thirdList">
   [..]
  <section>
   <ul id="fourthList">
    <li><a>Test 1</a></li>
    <li><a>Test 2</a></li>
    <li><a>Test 3</a></li>
   </ul>
  [..]

The thing is that, when someone clicks on a test, i want to loop through the list-items to look the position of the click up in the list (it there are items before or after)

Herefore i have the following


$("a").click(function(event){
 [..]
 var parentEl = $(this).parents('ul').filter(":first").tagName;
 alert($(parentEl).attr("id"));
});

But this gives me firstList as an output. I assume jQuery looks through the document from top down, so the output with filter(:first) (oh and get(0)) as well makes sence i guess.. But how am i going to get the first parent of the clicked link?

If someone click on Test 2 i want to get fourthList as an output (and eventually the position, but that’s for later)

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try this

    $("a").click(function(event){
  [..]
  var $parentEl = $(this).closest('ul');
  alert( $parentEl.attr("id") );
});

    And to get the position of the link among it’s siblings

    $("a").click(function(event){
  [..]
  // returns the 0-based index of the `li` among it's sibling `li`s
  var idx = $(this).parent().prevAll().length;
});
    • 0