Get next sibling elements with class name "first", between the li element with class name "start" and the class name "stop". - Javascript jQuery Method and Property

Javascript examples for jQuery Method and Property:nextUntil

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

Description

Get next sibling elements with class name "first", between the li element with class name "start" and the class name "stop".

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
.siblings * {/*  ww w  .  ja  va2  s  .c  o  m*/
    display: block;
    border: 2px solid #EEEEEE;
    color: lightgrey;
    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("li.stop");
    $("li.start").nextUntil(DOM, ".first").css({"color": "red", "border": "2px solid red"});
});
</script>
</head>
<body>

<div style="width:500px;" class="siblings">
  <ul>ul (parent)
    <li>li</li>
    <li>li</li>
    <li class="start">li</li>
    <li class="first">li</li>
    <li>li</li>
    <li class="first">li</li>
    <li class="stop">li</li>
  </ul>
</div>
</body>
</html>

Related Tutorials