jQuery element + next Selector


The element +next selector in jQuery is used to select the "next" element of the specified "element".

Syntax

The syntax is as follows −

("ele + next")

Above, ele is any valid selector, whereas the next parameter is used to specify the element that should be the next element of the element parameter

Example

Let us now see an example to implement the jQuery element +next selector 

 Live Demo

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("div + p").css("color", "orange");
   });
</script>
<style>
div {
   border:1px solid black;
   padding:10px;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<div>
<p>This is demo text.</p>
<span>span outside p element</span>
<p>This is demo text.</p>
</div>
<p>p next to div.</p>
<p>This is demo text.</p>
<div>
<p>This is demo text.</p>
<p>This is demo text. <span>span inside p element.</span></p>
<p>This is demo text.</p>
</div>
</body>
</html>

Output

This will produce the following output −

Updated on: 30-Dec-2019

96 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements