Replace text in an element with CSS

button.html

<button class="element">Old text</button>

site.css

.element {
  text-indent: -9999px;
  line-height: 0; /* Collapse the original line */
}

.element::after {
  content: "New text";
  text-indent: 0;
  display: block;
  line-height: initial; /* New content takes up original line height */
}

Should work for IE8+.

Here it is in a Fiddle.

Works fine. It's very interesting