Creating A Simple Twitter Safari Extension Using JavaScript

How would one go about creating a simple Twitter Safari extension using Javascript? Ideally, I would like to find tweet post titles and change their text color as a user scrolls do

Solution 1:

You can use the inspector in the Firefox or Chrome Developer Tools to view the classes and id's of a given element.

Twitter tweets have a classname of tweet, so for example, the following would make all the tweet's backgrounds red and log the tweet text to the console..

var myNodelist = document.getElementsByClassName("tweet");
for(var i=0; i<myNodelist.length; i++){
  // change the background to red
  myNodelist[i].style.backgroundColor = "red"

  // get the actual tweet text
  var tweet = myNodelist[i].getElementsByClassName('TweetTextSize')[0].textContent.trim();
  console.log(tweet);
}