So I want to write an extension in chrome to show something near the username of each user in twitter. A person can log in to see their followers score based on some criteria. But I seem to stuck at the first step. I cannot find the right selector for it. It shows a default span area. How can I get around that? As it should be an extension or something with greasemonkey I cannot use twitter's api for it.
This is their html:
<div class="css-1dbjc4n r-1wbh5a2 r-dnmrzs">
<a href="/_SomeFriend" role="link" tabindex="-1" class="css-4rbku5 css-18t94o4 css-1dbjc4n r-1loqt21 r-1wbh5a2 r-dnmrzs r-1ny4l3l">
<div dir="ltr" class="css-901oao css-1hf3ou5 r-14j79pv r-18u37iz r-37j5jr r-a023e6 r-16dba41 r-rjixqe r-bcqeeo r-qvutc0">
<span class="css-901oao css-16my406 r-poiln3 r-bcqeeo r-qvutc0">@_SomeFriend</span>
</div>
</a>
</div>
And a simple $('.css-901oao') returns an unrelated div.
<div dir="auto" class="css-901oao r-18jsvk2 r-37j5jr r-a023e6 r-16dba41 r-rjixqe r-bcqeeo r-qvutc0" style="">
<span class="css-901oao css-16my406 r-poiln3 r-bcqeeo r-qvutc0">To view keyboard shortcuts, press question mark</span>
</div>
I want to select/find all the usernames and their places. Any help is appreciated.