Find the value of dropdown from each row in a table

Question

I have a table and each row has two dropdowns. I am trying to store the entire table values in an array using javascript.

I am able to fetch the values of cells[0] and cells[1] but not cells[3] and cells[4] which contain dropdowns.

Here is my javascript

    $(document).on('click', '#classTypeFetch', function (e) {
    var table = document.getElementById('tblClassificationSearchResult');
    var tableArray = [];
    for (var i = 1; i < table.rows.length; i++) {
        tableArray.push({
            charName: table.rows[i].cells[0].innerHTML,
            charDesc: table.rows[i].cells[1].innerHTML,
            parentValue: table.rows[i].cells[2].getElementById("ddlParent").value,
            childValue: table.rows[i].cells[3].getElementById("ddlParent").value,
        });
    }
    var result = tableArray;
});