Class Name

In this chapter you will learn:

Syntax for class name selector
Examples for jQuery class name selector
How to select nested classes

Syntax

$('.myclass') selects all elements that have a class of myclass.

Examples

$('.myclass') selects all elements that have a class of myclass.
$('p.myclass') selects all paragraphs that have a class of myclass.
$('.myclass.otherclass') selects all elements that have a class of both myclass and otherclass.

The following code shows how to find the element with the class "myClass".

<html><!--from j a  v a 2 s . c om-->
  <head>
    <script src="http://java2s.com/style/jquery-1.8.0.min.js"/>
    <script type="text/javascript">
        $(document).ready(function(){

            $(".myClass").css("border","3px solid red");

        });
    </script>
  </head>
  <body>
    <body>
          <div class="myClass">div class="myClass"</div>

          <span class="myClass">span class="myClass"</span>
    </body>
</html>

Click to view the demo

Select for nested classes

The following code shows how to Select from nested classes.

<html><!--from ja v  a 2 s. c  o m-->
  <head>
    <script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
  $(document).ready(function(){
    $(".myClass.myOtherClass").css("border","1px solid red");
  });
    </script>
  </head>
  <body>
      <div class="notMe">div </div>
      <div class="myClass">div</div>
      <span class="myClass myOtherClass">span</span>
  </body>
</html>