Return elements with class names "first", "second" and "third", that are the next sibling elements between h2 and h5 - 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

Return elements with class names "first", "second" and "third", that are the next sibling elements between h2 and h5

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
.siblings * {//from  w  w w.  j  a v  a2s  .  com
    display: block;
    border: 2px solid lightgrey;
    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(){
    $("h2").nextUntil("h5", ".first,.second,.third").css({"color": "red", "border": "2px solid red"});
});
</script>
</head>
<body>

<div style="width:500px;" class="siblings">
  <div>parent
    <p>p</p>
    <span>span</span>
    <h2>h2</h2>
    <h3>h3</h3>
    <p>p</p>
    <p class="first">p class "first"</p>
    <p>p</p>
    <span class="second">span class "second"</span>
    <span class="second">span also class "second"</span>
    <span>span</span>
    <h3 class="third">h3 class "third"</h3>
    <h5>h5</h5>
   </div>
</div>

</body>
</html>

Related Tutorials