select ul ancestor between span element with class name "child", and div element with class name "ancestors" - Javascript jQuery Method and Property

Javascript examples for jQuery Method and Property:parentsUntil

  1. HOME
  2. Javascript
  3. jQuery Method and Property
  4. parentsUntil

Description

select ul ancestor between span element with class name "child", and div element with class name "ancestors"

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
.ancestors * {//w ww  .  ja va  2  s. c  o m
    display: block;
    border: 2px solid red;
    color: blue;
    padding: 5px;
    margin: 15px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    var DOM = document.getElementsByClassName("myClass");
    $(".child").parentsUntil(DOM, "ul").css({"color": "red", "border": "2px solid red"});
});
</script>
</head>

<body class="ancestors"> body
  <div style="width:500px;" class="myClass">div
    <ul>ul
      <li>li (direct parent)
        <span class="child">span</span>
      </li>
    </ul>
  </div>
</body>
</html>

Related Tutorials