How to find Element by Class Name using Selenium?


Find Element by Class Name in Selenium Python

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.

1. There is only one 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.

HTML Webpage

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

Python Program (Selenium)

from selenium import webdriver
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.chrome.service import Service as ChromeService
from selenium.webdriver.common.by import By

# Setup chrome driver
driver = webdriver.Chrome(service=ChromeService(ChromeDriverManager().install()))

# Navigate to the url
driver.get('/tmp/selenium/index-49.html')

# Find element by Class Name
my_div = driver.find_element(By.CLASS_NAME, 'xyz')
print(my_div.get_attribute("outerHTML"))

# Close the driver
driver.quit()

Output

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

2. There are 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.

HTML Webpage

<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 import webdriver
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.chrome.service import Service as ChromeService
from selenium.webdriver.common.by import By

# Setup chrome driver
driver = webdriver.Chrome(service=ChromeService(ChromeDriverManager().install()))

# Navigate to the url
driver.get('/tmp/selenium/index-50.html')

# Find element by Class Name
my_div = driver.find_element(By.CLASS_NAME, 'xyz')
print(my_div.get_attribute("outerHTML"))

# Close the driver
driver.quit()

Output

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

3. There is 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.

HTML Webpage

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

Python Program (Selenium)

from selenium import webdriver
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.chrome.service import Service as ChromeService
from selenium.webdriver.common.by import By

# Setup chrome driver
driver = webdriver.Chrome(service=ChromeService(ChromeDriverManager().install()))

# Navigate to the url
driver.get('/tmp/selenium/index-51.html')

# Find element by Class Name
my_div = driver.find_element(By.CLASS_NAME, 'xyz')
print(my_div.get_attribute("outerHTML"))

# Close the driver
driver.quit()

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 Python Selenium tutorial, we learned how to find an element by class name in webpage using Selenium.