List Item's Divider Selector

List Item's Divider Selector

This is related to jQuery Mobile but specific to a jQuery selector. Is it possible to have a selector find a specific list-item's divider (if one)? For example;


  1. <ul data-role="listview">
  2.       <li data-role="list-divider">A List Divider</li>
  3.       <li><a href="#">A List Item</a></li>
  4.       <li><a href="#">B List Item</a></li>
  5.       <li data-role="list-divider">FIND ME</li>
  6.       <li><a href="#">Another Item</a></li>
  7.       <li data-important="true"><a href="#">GET MY DIVIDER</a></li>
  8.       <li><a href="#">Bnother Item</a></li>
  9.       <li data-role="list-divider">C List Divider</li>
  10.       <li><a href="#">A List Item</a></li>
  11.       <li><a href="#">B List Item</a></li>
  12. </ul>

So here we have one list item that has a data attribute of "data-important". The selector should find this list-item's divider. Since this isn't a hierarchical structure it's tough to find the "parent" without finding other dividers. JQuery Mobile figures this out with a JavaScript loop going backwards through the list, however I'm wondering if it can be done with a Selector instead.


I've tried something like "li:jqmData(role=list-divider):has(~ li:jqmData(important=true))" but that obviously gets all dividers above the list-item marked important.


If needed, I can give a reasoning for this feature too. Thanks for any suggestions.