• title

    • title

    • " />
      • title

      • title

      • " />
        • title

        • title

        • "/>
          DEVHIDE
          • Home (current)
          • About
          • Contact
          • Cookie
          • Home (current)
          • About
          • Contact
          • Cookie
          • Disclaimer
          • Privacy
          • TOS
          Login Or Sign up

          Find closest parent in relation to (not just contained within) a context

          1.1k Views Asked by wheresrhys At 25 February 2011 at 14:49 2025-12-20T03:51:24.416112

          With the following html

          <ul id="accordion">
              <li>
                  <ul>
                      <li><h3>title</h3></li>
                  </ul>
              </li>
              <li>
                  <ul>
                      <li><h3>title</h3></li>
                  </ul>
              </li>
              <li>
                  <ul>
                      <li><h3>title</h3></li>
                  </ul>
              </li>       
          </ul>
          

          I have the outer ul stored in a variable

          var acc = $("#accordion")[0]  
          

          in the general case I am just passed the DOM element and can't necessarily specify a selector

          When a h3 is clicked I want to get the top level li that contains it. In the general case there could be any kind of markup between the accordion ul and the element I wnat to fetch, and between the element to fetch and the h3... but what I will have is a selector that lets me get to the element from the accordion using the ">" selector.

          e.g. var items = $(">li", acc);

          The trouble is that when I start from a clicked h3 ("this" inside the click handler) It's difficult to find the specific item.

          $(this).closest(">li", acc);
          

          returns an empty jQuery (maybe a bug? although it's difficult to define what ">" means in this instance, where the top level element is dynamic)

          $(this).parents(">li")
          

          doesn't allow a context to be set, so could potentially return too many elements

          Is there a way to do what I want?

          *edit: html now makes the problem clearer

          javascript jquery dom ancestor
          Original Q&A
          4

          There are 4 best solutions below

          0
          wheresrhys wheresrhys On 26 February 2011 at 08:48 BEST ANSWER
          $(">li",acc).has(this)
          

          works in general; setting a context on an initial jQuery appears to be the only place that startinga selector with ">" works in jQuery

          2
          naivists naivists On 25 February 2011 at 14:51

          How about $(h3).closest(".item"); ? According to "closest" documentation, it will traverse the DOM up from current node until it finds a node that matches your selector.

          6
          David Tang David Tang On 25 February 2011 at 15:21

          Go the other way, to guarantee the child relationship:

          acc.children('li').has(this);
          
          1
          james goldswain james goldswain On 25 February 2011 at 16:07
          jQuery(this).parents('li:last');
          

          Related Questions in JAVASCRIPT

          • Angular Show All When No Filter Is Supplied
          • Why does a function show up as not defined
          • I count the time the user takes to solve my quiz using Javascript but I want the same time displayed on another page
          • Set "More" "Less" font size
          • Using pagination on a table in AngularJS
          • How to sort these using Javascript or Jquery Most effectively
          • how to fill out the table with next values in array with one button
          • State with different subviews
          • Ajax jQuery firing multiple time display event for the same result
          • Getting and passing MVC Model data to AngularJS controller
          • Disable variable in eval
          • javascript nested loops waiting for user input
          • .hover() seems to overwrite .click()
          • How to sort a multi-dimensional array by the second array in descending order?
          • How do I find the fonts that are not loading in a CORS situation ( MoovWeb )?

          Related Questions in JQUERY

          • How to sort these using Javascript or Jquery Most effectively
          • Ajax jQuery firing multiple time display event for the same result
          • .hover() seems to overwrite .click()
          • Check for numeric value with optional commas javascript
          • Extending Highmaps Side Effect
          • Array appending after each onclick and loop in javascript
          • how can i append part of a table based on how many tr it has?
          • Play multiple audio files in a slider
          • Remove added set of rows
          • Access property of an object of type [Model] in JQuery
          • AJAX PHP - Reload div after submit
          • proengsoft/laravel-jsvalidation ReferenceError: jQuery is not defined
          • when a checkbox is checked how to display a different hidden element using javascript
          • Get jquery error Uncaught RangeError: Maximum call stack size exceeded
          • Removing only the closest thead on table filtering

          Related Questions in DOM

          • getElementsByName returns an element with a wrong name
          • Scala.js: Selecting and manipulating generated SVG
          • How to add different text after echo output using PHP
          • Undefined when passing DOM object in Javascript
          • jQuery trigger when inner html DOM ready
          • QDomDocument toString
          • How to use DOMParser in PhantomJS?
          • How to append the text (increasing order) using DOM parser in PHP?
          • How's Virtual DOM implementation is different than createDocumentFragment() if no state is observed?
          • simple dom parser double find() doesn't work?
          • Polymer 1.0 Conditional dom-repeat issue
          • Javascript help using createElement() and appendChild()
          • How to stop XML Tag Attributes from sorting in Ascending Order after modifying the XML file using Java?
          • getAttribute by TagName - JS
          • Html dom parser php table

          Related Questions in ANCESTOR

          • xslt: traverse chain of ancestors in reverse order
          • Find least common ancestor of two nodes in java
          • Wrapping an XML element with its ancestor nodes/tags
          • Find closest parent in relation to (not just contained within) a context
          • What is the issue with the method acces in ancestors chain in Ruby
          • How to find ancestors more than one level above
          • How do I remove an attribute and an element if an ancestor's attribute holds a certain value using xsl
          • Select attribute value of first node of ancestor
          • AppEngine NDB: How to apply ancestors correctly?
          • How to store user-specific data from Android in Google App Engine Datastore. Ancestor or not?
          • LogicException: The selected node does not have a form ancestor
          • How to match ancestor-or-self for contains Xpath?
          • Lowest Common Ancestor implementations - what's the difference?
          • Nokogiri equivalent of jQuery closest() method for finding first matching ancestor in tree
          • What exactly are ancestors in DAG

          Trending Questions

          • UIImageView Frame Doesn't Reflect Constraints
          • Is it possible to use adb commands to click on a view by finding its ID?
          • How to create a new web character symbol recognizable by html/javascript?
          • Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
          • Heap Gives Page Fault
          • Connect ffmpeg to Visual Studio 2008
          • Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
          • How to avoid default initialization of objects in std::vector?
          • second argument of the command line arguments in a format other than char** argv or char* argv[]
          • How to improve efficiency of algorithm which generates next lexicographic permutation?
          • Navigating to the another actvity app getting crash in android
          • How to read the particular message format in android and store in sqlite database?
          • Resetting inventory status after order is cancelled
          • Efficiently compute powers of X in SSE/AVX
          • Insert into an external database using ajax and php : POST 500 (Internal Server Error)

          Popular # Hahtags

          javascript python java c# php android html jquery c++ css ios sql mysql r reactjs

          Popular Questions

          • How do I undo the most recent local commits in Git?
          • How can I remove a specific item from an array in JavaScript?
          • How do I delete a Git branch locally and remotely?
          • Find all files containing a specific text (string) on Linux?
          • How do I revert a Git repository to a previous commit?
          • How do I create an HTML button that acts like a link?
          • How do I check out a remote Git branch?
          • How do I force "git pull" to overwrite local files?
          • How do I list all files of a directory?
          • How to check whether a string contains a substring in JavaScript?
          • How do I redirect to another webpage?
          • How can I iterate over rows in a Pandas DataFrame?
          • How do I convert a String to an int in Java?
          • Does Python have a string 'contains' substring method?
          • How do I check if a string contains a specific word?
          .

          Copyright © 2021 Jogjafile Inc.

          • Disclaimer
          • Privacy
          • TOS
          • Homegardensmart
          • Math
          • Aftereffectstemplates