How can i make my actual text transform into another text when the user hovers his/her mouse on top of the original text. I have provided the HTML code below. Any feedback is much appreciated!

```
<a href="#" class="btn_action_1">
    <span>Justice League</span>
<i class="ico_arrow"></i>
</a>

```

EX: I have a text called ABC. When user points mouse on ABC, the element will transform into DEF. Got my point?