$ .getjson无法将数组对象附加到html

我的json数据如下所示

Hi my json data is like below

[{
    "menu": "File",
}, {
    "menu": "File1",
}]

我已经编写了jquery代码，将响应附加到html如下

I have written jquery code to append the response to html like below

$(document).ready(function () {
    $.getJSON('data.json', function (data) {

        var template = $('#personTpl').html();
        var html = Mustache.to_html(template, data);
        $('#sampleArea').html(html);
    });

});

胡子模板在下面:

<script id="personTpl" type="text/template">
    <h1>{{menu}}</h1>
</script>

请帮助