Да, так тоже пробовал. Не работает.

$(document).ready(function() {

            var ToC = '<nav role="navigation" class="table-of-contents">' + '<ul>';
            var newLine, el, title, pel;


            $('#sendTo').on('click', function () {

                var insertData = $('#insertArea').val();
                var div = $("<div>", {html : insertData});

                $(':header', div).each(function (i,el) {
                    el = $(el);
                    var title = el.text();
                    /*el.attr('id' , title).html(title);*/
                    el.html('<a id="' + title + '"></a>'+title);

                    newLine = '<li>' + '<a href="#' + title + '">' + title + '</a>' + '</li>';
                    ToC += newLine;
                });

                ToC += '</ul>' + '</nav>' + div.html();
                $('#pastArea').val(ToC);

                $('p', div).remove();

            });
        });

Спасибо за разъяснения.

Stenli,
25 строка должна идти до 22! перенесите в 21 или в 11

Кое-что изменил, добавив FOR, чтобы добавлял к анкорам не кириллицу а некий текст с приставкой +1.

$(':header', div).each(function (i,el) {
                el = $(el);
                var title = el.text();

                /*el.attr('id' , title).html(title);*/

                for (var e=0; e < i+1; e++ ) {
                    var z=e+1;
                    el.html('<a id="' + z + '_toc' + '"></a>'+title);
                    newLine = '<li>' + '<a href="#' + z + '_toc' + '">' + title + '</a>' + '</li>';
                }
                ToC += newLine;
            });

Работает, только я не совсем уверен на счет правильности внутри цикла , где сравнивается e < i+1, что i+1 это правильно. Само как-то получилось. И можно ли в такую конструкцию вообще вкладывать FOR?

в данном случае FOR бесполезен, и лучше бы его убрать!

Stenli,

$(":header", div).each(function(i, el) {
    el = $(el);
    var title = el.text();
    var id = ++i + "_toc";
    var a = $("<a>",{id : id, text : title});
    el.html(a);
    ToC += "<li><a href='#"+id+"'>" + title + "</a></li>"
});

Спасибо, буду разбирать.
А почему бесполезен, ведь он работает?
Ошибка может возникнуть?

да, но это не код, вместо того чтобы покрасить сразу в зелёный, вы красите, за каким-то, во все цвета перед зелёным.