Как заполнить таблицу сервлетами и Ajax

Question

Лично у меня есть сервлет, который возвращает карту через Json, и я хотел бы использовать значения этой карты (ключ и значение) для заполнения таблицы через Ajax.

Мой код в Ajax выглядит следующим образом:

success:function(responseJson){
$(".results").show();
$(".content").show();

var headTable = $(".tablesorter > thead > tr");
var bodyTable = $(".tablesorter > tbody > tr");

$.each(responseJson, function(key, value){
    $("<th>").html(key).appendTo(headTable);

    for (var i = 0; i < value.length; i++){
        $("<td>").val(key).html(value[i]).appendTo(bodyTable);
    }
});

Ключ моей карты. Мне бы хотелось, чтобы это было значение заголовка таблицы, а значения карты - это тело таблицы.

Таблица, которую я хочу заполнить следующим:

<table cellspacing="1" class="tablesorter">
<thead>
    <tr>

    </tr>
</thead>
<tbody>
    <tr class="even">

    </tr>
</tbody>

Однако способ, которым мой код должен быть, а не создавать строки со значениями из карты, это создание нескольких столбцов.

Что я должен сделать, чтобы мой код вел себя правильно?