title: Selenium WebDriver - Finding Elements using cssSelector and nth child
body: <pre><code>&lt;ul&gt;
  &lt;li class="active"&gt;
      &lt;a href="#"&gt;
      &lt;i class="fa fa-home"&gt;&lt;/i&gt;&lt;br&gt;
      &lt;span class="title"&gt;Home&lt;/span&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
      &lt;a href="#"&gt;
      &lt;i class="fa fa-rss-square"&gt;&lt;/i&gt;&lt;br&gt;
      &lt;span class="title"&gt;Posts&lt;/span&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
      &lt;a href="#"&gt;
      &lt;i class="fa fa-calendar"&gt;&lt;/i&gt;&lt;br&gt;
      &lt;span class="title"&gt;Events&lt;/span&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
      &lt;a href="#"&gt;
      &lt;i class="fa fa-bar-chart-o"&gt;&lt;/i&gt;&lt;br&gt;
      &lt;span class="title"&gt;My Activity&lt;/span&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  
  &lt;li&gt;
      &lt;a href="#"&gt;
      &lt;i class="fa fa-edit"&gt;&lt;/i&gt;&lt;br&gt;
      &lt;span class="title"&gt;Assessments&lt;/span&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I want to locate the respective span element. I want to check the order of the span elements using css selector. So when I use selenium IDE,I will verify it like below(using nth child concept).</p>
  
  <p>verifyText  |  css=.title:nth(0)  |  Home <br/>
  verifyText  |  css=.title:nth(1)  |  Posts <br/>
  verifyText  |  css=.title:nth(2)  |  Events <br/>
  verifyText  |  css=.title:nth(3)  |  My Activity <br/>
  verifyText  |  css=.title:nth(4)  |  Assessments <br/></p>
  
  <p>But when I do the same thing in Selenium WebDriver I am not able to locate the elements with the order which I did using Selenium IDE.</p>
  
  <p>Below are the codes that I used in WebDriver and it dint work.</p>
  
  <pre><code>driver.findElement(By.cssSelector(".title:nth(0)")); // to locate the "Home" element
  
  driver.findElement(By.cssSelector(".title:nth-of-type(0)")); // to locate the "Home" element
  
  driver.findElement(By.cssSelector(".title:nth-child(0)")); // to locate the "Home" element
  </code></pre>
  
  <p>Could anyone please help me.</p>