jquery - 鼠标悬停时更改内容并在鼠标移开后恢复

Question

我有一个带有一些文本的 DIV，想要在鼠标悬停时更改文本，并在鼠标移开后恢复文本。就像下面这样。

<div class="test">Text of Mouseout</div>

<div class="test">Text of Mouseover</div>

我尝试按照以下方式进行操作，但是当鼠标悬停时文本会发生变化，但在鼠标移开后不会恢复:

$(".test").hover(
  function() {
    var $original = $(this).clone();
    $(this).html("Text of Mouseover");
  },
  function() {
    $(this).html($original);
  }
);

Answer 1

$("div.test").hover(

  function () {
       originalText=$(this).text();
    $(this).text('New Text');
  }, 
  function () {
    $(this).text(originalText);
  }
      );

<强> Live Demo

​