How to find Element by Class Name using Selenium?

Find Element by Class Name

To find an HTML Element by class name attribute using Selenium in Python, call find_element() method and pass By.CLASS_NAME as the first argument, and the class name (of the HTML Element we need to find) as the second argument.

find_element(By.CLASS_NAME, "class_name_value")

If there are multiple HTML Elements with the same given class name, then find_element() returns the first HTML Element of those.

Scenario 1: HTML page with single element by given class name

In the following example, we have an HTML page with a div element whose class name is "xyz". In the Python program, we will find the HTML element whose class name is 'xyz', using find_element() method, and print that element to the console.

index.html

<html>
 <body>
  <p>Hello World!</p>
  <div class="xyz">Read More</div>
 </body>
</html>

Python Program (Selenium)

from selenium.webdriver.chrome.service import Service
from selenium import webdriver
from selenium.webdriver.common.by import By

service = Service(executable_path="/usr/local/bin/chromedriver")
#initialize web driver
with webdriver.Chrome(service=service) as driver:
    #navigate to the url
    driver.get('http://127.0.0.1:5500/localwebsite/index.html')
    #find element by class name
    myDiv = driver.find_element(By.CLASS_NAME, 'xyz')
    print(myDiv.get_attribute("outerHTML"))

Output

<div class="xyz">Read More</div>

Scenario 2: HTML page with multiple elements by given class name

Now, let us consider the scenario where there are multiple HTML Elements with the same class name. We will use find_element() function to find the first element whose class name is 'xyz'.

Even through there are three elements with the same given class name, find_element() returns only the first element.

index.html

<html>
 <body>
  <p>Hello World!</p>
  <div class="xyz">Read More</div>
  <div class="xyz">Report</div>
  <div class="xyz">Next</div>
 </body>
</html>

Python Program (Selenium)

from selenium.webdriver.chrome.service import Service
from selenium import webdriver
from selenium.webdriver.common.by import By

service = Service(executable_path="/usr/local/bin/chromedriver")
#initialize web driver
with webdriver.Chrome(service=service) as driver:
    #navigate to the url
    driver.get('http://127.0.0.1:5500/localwebsite/index.html')
    #find element by class name
    myDiv = driver.find_element(By.CLASS_NAME, 'xyz')
    print(myDiv.get_attribute("outerHTML"))

Output

<div class="xyz">Read More</div>

Scenario 3: HTML page with no element by given class name

If there is no element by given class name, find_element() function raises NoSuchElementException.

In the following example, we have taken an HTML page with no elements by name="xyz". When we try to find element by the name='xyz' using find_element() function, the function throws NoSuchElementException.

index.html

<html>
 <body>
  <p>Hello World!</p>
  <div>Read More</div>
  <div>Report</div>
  <div>Next</div>
 </body>
</html>

Python Program (Selenium)

from selenium.webdriver.chrome.service import Service
from selenium import webdriver
from selenium.webdriver.common.by import By

service = Service(executable_path="/usr/local/bin/chromedriver")
#initialize web driver
with webdriver.Chrome(service=service) as driver:
    #navigate to the url
    driver.get('http://127.0.0.1:5500/localwebsite/index.html')
    #find element by class name
    myDiv = driver.find_element(By.CLASS_NAME, 'xyz')
    print(myDiv.get_attribute("outerHTML"))

Output

    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":".xyz"}

Summary

In this tutorial of Python Examples, we learned how to find an element by class name in webpage using Selenium.