Changing link content on mouse press in JQuery by html()

Good day! For this example of function html() http://api.jquery.com/html/ How to return to link they first look, after next clicking?

like doing when use "scroll down" link, after pressing it changing to "scroll up" (show switch to hide) and all this continued in case of clicking.

if use code like this

    <p>scroll down</p>
<script>
    $("p").click(function () {
      var htmlStr = $(this).html();
      $(this).html('scroll up');
开发者_JAVA技巧    });
</script>

in this example assigned last value.

---

Are you looking for .toggle()?

$('p').toggle(function(){
  $(this).html('scroll up');
}, function(){
  $(this).html('scroll down');
});

Example on JsFiddle

---

If I understand what you're asking, this is one way to do it:

window.textIndex = 1;
window.texts = [ "Scroll Up", "Scroll Down" ];
$("p").click(function () {
    textIndex = 1 - textIndex;
    $(this).html(texts[textIndex]);
});