jQuery Selectors: Sibbling selector ~

$(‘prev ~ sibbling’)

It selects a sibbling element that is after the prev.

Both elements will have the same parent.

<!DOCTYPE html>
<html>
<head lang='en'>
    <meta charset='UTF-8'>
    <title>Codecrawl.com</title>
    <script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
    <script>
        $(function () {
            $('h2 ~ p').css({'font-family': 'sans-serif', 'color': 'blue', 'font-size': '125%'});
        });
    </script>
</head>
<body>
<article>
    <h1>American Music</h1>

    <p>The different types of music genre in America.</p><!-- Child combinator targets this paragraph -->
    <section>
        <h2>Country</h2>

        <p>Taylor Swift</p><!-- Adjacent sibling combinator targets this paragraph -->
        <p>Carrie Underwood</p>
    </section>
    <h1>Hard rock and metal</h1>

    <p> Nirvana has come to be regarded as one of the most influential and important rock bands of the modern era.</p>
    <!-- Child combinator targets this paragraph -->
</article>
</body>
</html>

Series Navigation<< jQuery Selectors: Selects an element immediately preceded by a specific element
jQuery Selectors: Select element with checked attribute >>