How to read Div inner contents at ajax?

I'm trying to update the sql db by a List of variables sent from the Html page. Some of the Data are correctly sent, while others are not. I put the list in a div which is divided to two parts : "h1" and another "Div". The data at the header are all sent correctly, but the body itself which is at the second div isn't sent at all. This is the Div which the data is put at:

    $('#Classes').append('<div> <h1 class = "flip" wpID="' + subjects[i].Wkp_ID + '" lessonID="' + subjects[i].Ttb_lessonID + '" Date="' + Datecoming + '">' + subjects[i].sbj_Name + " Class:" + subjects[i].Ttb_Class + '</h1><div id ="NewBody" class="panel" contenteditable>' + subjects[i].Wkp_Body + '</div> </div>');

And that's how I read them at the ajax part:

    var WeekPlan = [];
    $('#Classes div').each(function (index) {
        var header = $(this).children('h1');
        var WeekBody = $(this).children('div').val();
        var wpID = header.attr('wpID');
        var lessonID = header.attr('lessonID');
        var Wkp_Date = header.attr('Date');

        WeekPlan[index] = { "Wkp_ID": wpID, "Wkp_Date": Wkp_Date, "Wkp_Body": WeekBody, "Wkp_lesson": lessonID }; 
        });

The Wkp_ID, Wkp_Date, Wkp_Lesson are right, but the Wkp_Body just returns an empty string. So do you know why is this happening and how can I truly read the body ? Most probably the problem is with this line:

    var WeekBody = $(this).children('div').val();

But how can I access it correctly ?

Thanks a lot.

Answers


Here is what worked for me in case anyone needs it:

Creating the div:

                 $('#Classes').append('<div class="BigDiv"> <h1 class = "flip" wpID="'+ subjects[i].Wkp_ID + '" lessonID="' + subjects[i].Ttb_lessonID + '" Date="' + Datecoming + '">' + subjects[i].sbj_Name + " class:" + subjects[i].Cls_Name + '</h1><div class="panel" contenteditable>' + subjects[i].Wkp_Body + '</div> </div>');

Need Your Help

Load ajax success data on new page

javascript jquery html ajax jsp

My ajax call hits the controller and fetches a complete JSP page on success. I was trying to load that data independently on a new page rather than within some element of the existing page. I tried