$.data() not working as expected after $.append()
<p>jsfiddle: <a href="http://jsfiddle.net/mAF6A/3/" rel="nofollow">http://jsfiddle.net/mAF6A/3/</a></p>

<p>I'm cloning a template TR in a table, setting a <code>$.data()</code> attribute of the clone and appending it to the table. After I append it, it looses the data attribute though. What am I doing wrong here?</p>

<pre><code>var arr = [{
    name: "one",
    id: 1},
{
    name: "two",
    id: 2},
{
    name: "three",
    id: 3}];

$.each(arr, function(i, item) {
    var clone = $("tr.template").clone().removeClass("template");
    clone.find(".value").html(item.name);
    clone.data("number", item.id);
    clone.find(".data").html("My data is: " + clone.data("number"));
    $("table").append(clone);
});

$("tr[data-number='2']").remove();
</code></pre>
