Selenium Get First Child Element using CSS

Profile picture for user arilio666

In Selenium you can select first child element using css.

Table of Contents

  1. Demo Website
  2. Select First Child using CSS
  3. Example

Demo Website

Demo Website

We will click on the women tab using first child.

selenium first child

CSS Selector First Child Selenium

Step 1: Select Parent 

Now here above selector covers the entire body of the three tabs under which they are present. So in this case it is the parent.

Step 2: Select all child

Under this ul tag, there are 3 li tags which are the respective tags of Women, Dresses, and T-shirts.

selenium find first child element>li 

Above selector will return all 3 elements.

Step 3: Select first child

Now use :first-child to select the first child>li:first-child


public class AppTest 
    WebDriver driver;
    public void befClass()
        System.setProperty("",System.getProperty("user.dir") + "//drivers//chromedriver");
        driver = new ChromeDriver();
        driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
    public void LoginTest()
        WebElement firstChildCSS = driver.findElement(By.cssSelector(">li:first-child"));