JQuery: проблема при определении значений текстовой области из нескольких идентичных форм

У меня есть форма с id "#modelform". Когда #modelform отправляется, появляется вторая форма с идентификатором класса.waldform. #modelform может быть отправлен несколько раз, поэтому это означает, что на моем сайте будет несколько.waldforms. Каждый.waldform предварительно заполняется значением по умолчанию, которое исходит из переменной $ counter. Таким образом, текстовая область первого.waldform заполняется "1", вторая - "2" и так далее. Эта текстовая область - это класс под названием ".waldnum". Когда передается.waldform, он вызывает функцию python "wald" и отправляет ее функцию.waldnum.

Однако, похоже, это не происходит. Каждая.waldform на самом деле является населением с переменной $ counter, но.waldnum не обновляется. Кажется, что.waldnum сохраняет свое первое значение "1".

Есть предположения?

var $counter = 0

$("#modelform").submit(function() {

    $counter++;

    $('body').append($counter) ;

    // post the form values via AJAX...
    $.post('/estimate', {name: $("#mymodel").val()}, function(data) {

        var $a_var = data['title']
        var $element = $('<div class="item">' + $a_var + '</div><br>');

        $('body').append($element) ;




        //create a waldform and set default value to $counter
        $('body').append('<form class="waldform" action="#" method="post"><input type="text" class="waldnum" value="' + $counter + '"/><input type="submit" value="Wald Test" /></form>');

        $(".waldform").submit(function() {

        //post the form values via AJAX...
        $.post('/wald', {name: $(".waldnum").val()}, function(data) {

            $('body').append($(".waldnum").val());

            var $a_var = data['title']
            var $element = $('<div class="item">' + $a_var + '</div><br>');

            $('body').append($element);



            });

            return false ;
        });



    });

    return false ;
});