Selecting by class (Must know)

In this recipe we'll see how to select a collection of elements using the Class selector. Our goal is to hide all of the elements having the class red.

How to do it...

To achieve the prefixed objective, we need to perform the following steps:

  1. Create a copy of the template.html file and rename it as selecting-by-class.html.
  2. Inside the <body> tag, add the following HTML markup:
    <h1 id="title" class="bold red">The Class selector</h1> <div id="container"> This example shows you how to use the Class selector. <p id="description" class="red">After you'll click the button below, the h1 and this p will be hidden.</p> <p id="note" class="green">This happens because of their class attribute's value.</p> </div> <button id="hide-button">Hide ...

Get Instant JQuery Selectors now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial