element + next Selector - Javascript jQuery Selector

Javascript examples for jQuery Selector:element next

Description

The ("element + next") selector selects the "next" (right after) element of the specified "element".

Syntax

Parameter Description
element Required. Any valid jQuery selector
next Required. element that should be the next element of the element parameter

The following code shows how to select the <div> element that are next to each <ul> element:

Demo Code

ResultView the demo in separate window

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("ul + div").css("background-color", "yellow");
});//from w  w w  . j  a  va 2s  . co  m
</script>
</head>
<body>

<ul>
  <li>List item</li>
</ul>

<div>This is a div element that is next to an ul element</div>
<p>This is a paragraph (not a div)</p>
<div>This is another div element (will not be selected)</div>

<ul>
  <li>List item</li>
</ul>

<div>This is also a div element that is next to an ul element</div>
<p>This is another paragraph (not a div)</p>
<div>This is another div element (will not be selected)</div>

</body>
</html>

Related Tutorials