jQuery Selectors: Select elements of a specific class

This entry is part 5 of 33 in the series jQuery Selectors

The example here will select a <ul> element with a class=’rock’.

So only the second list, American Rock is selected.

<!DOCTYPE html>
<html>
<head lang='en'>
    <meta charset='UTF-8'>
    <title>Lists</title>
    <script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
    <script>
        $(function () {
            $('ul.rock').css('color', 'navy');
        });
    </script>
</head>
<body>

<h4>British Pop</h4>
<ul>
    <li>Cold Play</li>
    <li>Depeche Mode</li>
    <li>Adele</li>
</ul>

<h4>American Rock</h4>
<ul class='rock'>
    <li>Linkin Park</li>
    <li>Nirvana</li>
    <li>Metalica</li>
</ul>

</body>
</html>
Series Navigation<< jQuery Selectors: Class and ID selectors
jQuery Selectors: Appending a li to an ul element >>