Change New item text on a page for all web part on the page

Question

I have a page with multiple web parts for different lists and I would like to change the text of New item button in the tool bar on the top of all web parts. In every web part, the "New item" text would be different in the end.

I have the following code that works if I put it in a script editor web part on the page containing web parts but only for the first web part. Any idea how to adapt it so it will change all the web parts "New item" button text for a different text for each web part?

<script type="text/javascript">
      window.onload = function() {
      document.getElementById("idHomePageNewAnnouncement").getElementsByTagName("span")[1].innerHTML="Add new report";    
             };    
    </script>

Answer 1

You might be able to select all the elements that has the text "New item" using jQuery and update the text.

Ex:

<script src="http://code.jquery.com/jquery-1.11.3.min.js" type="text/javascript"></script>

$( "span:contains('New item')" ).text("Add new report");