title: How to use chrome dev tools to find elements based on css class or id?
body: <p>Long time automation developer here (just for context).
  It's been bugging me for quite a while that the dev tools in chrome used to find elements just don't seem to work as I expect.  Hopefully someone can point out what I'm doing wrong.</p>
  
  <p>Looking at , say, sauce labs page: <a href="https://saucelabs.com/blog/selenium-tips-finding-elements-by-their-inner-text-using-contains-a-css-pseudo-class" rel="nofollow noreferrer">https://saucelabs.com/blog/selenium-tips-finding-elements-by-their-inner-text-using-contains-a-css-pseudo-class</a></p>
  
  <p>ok now that page has div's and anchors</p>
  
  <p><a href="https://i.stack.imgur.com/VVh93.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VVh93.png" alt="enter image description here"></a></p>
  
  <p>and indeed I can do <code>find ('a')</code> or <code>find('div')</code></p>
  
  <p>but why do I have a problem using classes or id's ?</p>
  
  <p><a href="https://i.stack.imgur.com/FDCYm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FDCYm.png" alt="enter image description here"></a></p>