Search code examples
javascripthtmlcssinnerhtml

Changing the text of a span element with no Id

I am very new to this so please bear with me.

I'm trying to change the inner HTML of this span on page load:

<span translate="my_team_tab" class="ng-scope">My Team</span>

I would like to change the "My Team" text to "My Event". I've been looking for hours and nothing seems to be working. Maybe it's not possible? Like I said, I'm new and would not know otherwise.

I haven't been able to try anything because almost all solutions mention using an Id and there is no Id assigned to this element. This code is hardcoded into the system I'm working in so I can't change the HTML itself.

Solution

  • You can do this with CSS if absolutely necessary.

    span[translate="my_team_tab"] {
  font-size: 0;
}

span[translate="my_team_tab"]:after {
  content: "My Event";
  font-size: initial;
}
    <span translate="my_team_tab" class="ng-scope">My Team</span>