Categories

Class Selector (".class")

Categories: Basic

jQuery('.class')

Description: Selects all elements with the given class.

  • jQuery('.class')

    version added: 1.0

    class   A class to search for. An element can have multiple classes; only one of them must match.

For class selectors, jQuery uses JavaScript's native getElementsByClassName() function if the browser supports it.

  • Finds the element with the class "myClass".

    HTML:
    <div class="notMe">div class="notMe"</div>
    
      <div class="myClass">div class="myClass"</div>
      <span class="myClass">span class="myClass"</span>
    CSS:
    
      div,span {
        width: 100px;
        height: 40px;
        float:left;
        padding: 10px;
        margin: 10px;
        background-color: #EEEEEE;
      }
      
    Code:
    $(".myClass").css("border","3px solid red");
  • Finds the element with both "myclass" and "otherclass" classes.

    HTML:
    <div class="myclass">div class="notMe"</div>
    
      <div class="myclass otherclass">div class="myClass"</div>
      <span class="myclass otherclass">span class="myClass"</span>
    CSS:
    
      div,span {
        width: 100px;
        height: 40px;
        float:left;
        padding: 10px;
        margin: 10px;
        background-color: #EEEEEE;
      }
      
    Code:
    $(".myclass.otherclass").css("border","13px solid red");