jquery if blank append else update

jquery if blank append else update

I have the below code, which is also contained in this fiddle.
<div id="box"><div>click in the box</div></div>
<p>Click a name</p>
<ul>
<li id="id-1">tom</li>
<li id="id-2">jerry</li>
</ul>
<div id="result"></div>
<script>
var id;
var person;
jQuery(document).on("click", "li", function (event) {
id = jQuery(this).attr('id') || '';
person = jQuery(this).text();
$("#box").show();
});
$(function () {
$("#box").click(function (e) {
var d = new Date();
$( "#result" ).append( "<div class='item'>" + person + " last
clicked the box at " + d + "</div>");
});
});
</script>
Currently you click on a persons name, then when you click on the box it
appends the persons name and the time you clicked on the box.
Instead of having this happen repeatedly I want to append the person if
they haven't been clicked before and if they have I want to update there
latest item with the last time they clicked the box.
I am really stuck with how I would go about doing this, something like if
blank append else update? What is the best way to handle something like
this?