Hello Readers,
nextUntil() is the jquery method which is used to return all the siblings of the next siblings elements of the same parent between the selector and stop and returns the new jquery object as a result.
Syntax :
$(selector).nextUntil(stop,filter)
Parameter :
stop : stop is the optional parameter which is used to select expression or element indicating where to stop the search for next matching siblings elements.
filter : filter is also a optional parameter which specifies a selector expression to search down the sibling elements between the selector and stop.
Code Example :
<html>
<head>
<style>
.siblings * {
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("li.start").nextUntil("li.stop").css({"color": "red", "border": "2px solid red"});
});
</script>
</head>
<body>
<div style="width:500px;" class="siblings">
<ul>ul (parent)
<li>li (sibling)</li>
<li>li (sibling)</li>
<li class="start">li (sibling with class name "start")</li>
<li>li (the next sibling of li with class name "start")</li>
<li>li (the next sibling of li with class name "start")</li>
<li>li (the next sibling of li with class name "start")</li>
<li class="stop">li (sibling with class name "stop")</li>
</ul>
</div>
<p>This is a paragraph</p>
</body>
</html>
In the above code we use the nextUntil() method and return all next sibling elements between li element with class name start and the li element with class name stop in jquery.
0 Comment(s)