show div tags along with column value when i click on table row

i want to add div tag after clicked row in table

My Requriement are

Except checkbox if i click any where in row i want to display div tag below row and display column value in div with Close Button on right side, again if i click on same row i want to close div tag

if i checked Select all checkbox then select all checkbox in table, if i unchecked atleast one checkbox in table then immediately uncheck selectall checkbox in above table

this below jquery code is used to select all checkbox in table but i want to do one more if i uncheck atleast one checkbox in table i want to uncheck select all checkbox

function chkAll() {
        var row = $("#gridSent tr");
        if ($("#chkParent").prop("checked") == true) {
            for (var i = 0; i < row.length; i++) {
                var chkCell = row[i].cells[0];
                for (var j = 0; j < chkCell.childNodes.length; j++) {
                    if (chkCell.childNodes[j].type == "checkbox") {
                        chkCell.childNodes[j].checked = true;
                    }
                }
            }
        }
        else {
            for (var i = 0; i < row.length; i++) {
                var chkCell = row[i].cells[0];
                for (var j = 0; j < chkCell.childNodes.length; j++) {
                    if (chkCell.childNodes[j].type == "checkbox") {
                        chkCell.childNodes[j].checked = false;
                    }
                }
            }
        }
    }