Table td Converted to div not working - what is wrong please

Please show me what I'm doing wrongly.

I have a Table tr/td converted to div, but I'm not getting exactly what it should look like. I must be definitely doing something wrong. Can someone please show me?

My code/script is pasted below

public class DropdownDTO
    {
        public string InsBranchCode  { get; set; }
        public string FullDescription { get; set; }
    }


    public class Underwriting_InsurerPolicyDistribution
    {
        public string InsBranchCode  { get; set; }
        public string PolicyRefCode{ get; set; }
        public string InsurerLeadCode{ get; set; }
        public string PercentageCover{ get; set; }
        public string InsBranchCode  { get; set; }
        public bool isConfirmed{ get; set; }

    }


       public static IEnumerable<DropdownDTO> InsurerBranchDropDownList(this HtmlHelper htmlHelper)
        {
            var context = HttpContext.Current;

            var itemList = new List<DropdownDTO>();

            if (itemList == null)
            {
                var list = new List<DropdownDTO>();
                list.Add(new DropdownDTO() { InsBranchCode = string.Empty, FullDescription = "Please select a Branch...." });
                list.Add(new DropdownDTO() { InsBranchCode = "0001", FullDescription = "Nigeria" });
                list.Add(new DropdownDTO() { InsBranchCode = "0002", FullDescription = "Zambia" });
                list.Add(new DropdownDTO() { InsBranchCode = "0003", FullDescription = "South Africa" });
                list.Add(new DropdownDTO() { InsBranchCode = "0004", FullDescription = "Ghana" });
                list.Add(new DropdownDTO() { InsBranchCode = "0005", FullDescription = "SeriaLeone" });
                list.Add(new DropdownDTO() { InsBranchCode = "0006", FullDescription = "Cotonou" });
                list.Add(new DropdownDTO() { InsBranchCode = "0007", FullDescription = "Ivory Coast" });
                list.Add(new DropdownDTO() { InsBranchCode = "0008", FullDescription = "Egypt" });
                list.Add(new DropdownDTO() { InsBranchCode = "0009", FullDescription = "Mozambique" });
                list.Add(new DropdownDTO() { InsBranchCode = "0010", FullDescription = "Maurutania" });
                list.Add(new DropdownDTO() { InsBranchCode = "0011", FullDescription = "Niger" });
                list.Add(new DropdownDTO() { InsBranchCode = "0012", FullDescription = "Democratic Republic of Cogo" });
                list.Add(new DropdownDTO() { InsBranchCode = "0013", FullDescription = "Central African Replublic" });
                list.Add(new DropdownDTO() { InsBranchCode = "0014", FullDescription = "South Africa" });
                list.Add(new DropdownDTO() { InsBranchCode = "0015", FullDescription = "Tunisia" });
                list.Add(new DropdownDTO() { InsBranchCode = "0016", FullDescription = "Algeria" });
                list.Add(new DropdownDTO() { InsBranchCode = "0017", FullDescription = "Kenya" });
                itemList = list;
            }
            return itemList;
        }
 
   <a href="#showDialog" class="btn btn-primary" title="Apportionment" data-toggle="modal" data-id="">Branches</a>


      <div class="row">
            <div class="col-md-12 col-sm-8 col-xs-12 col-xs-offset-0">
                <div id="showDialog" class="modal fade" tabindex="-1" data-backdrop="static" data-keyboard="false">
                    <div class="modal-dialog modal-lg" style="height: 50vh; max-height: 50vh; width: 110vh; max-width: 180vh; overflow-y: initial !important;">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button class="close" type="button" data-dismiss="modal">&times;</button>
                                <h4 id="showDialogLabel" class="modal-title">Apportionment</h4>
                            </div>
                            <div class="modal-body">
                                <div class="table-responsive">
                                    <div id="requestItems" class="divTable">
                                        <div class="divTableHeading">
                                            <div class="divTableRow">
                                                <div class="divTableCell">
                                                    <div  class="btn btn-primary btn-sm">
                                                        <strong></strong><span class="glyphicon glyphicon-remove center-block"></span>
                                                    </div>
                                                </div>
                                                <div class="divTableCell">Branch Code</div>
                                                <div class="divTableCell">Lead</div>
                                                <div class="divTableCell">% Covered</div>
                                                <div class="divTableCell">Confirm?</div>
                                            </div>
                                        </div>
                                        <div class="divTableBody">
                                            @{if (!string.IsNullOrEmpty(Model.Underwriting_PolicyFile.PolicyRefCode))
                                            {
                                                var prefx4 = "Underwriting_InsurerPolicyDistribution"; var prefx6 = prefx4 + ".index";
                                                for (var i = 1; i <= Model.Underwriting_InsurerPolicyDistribution.Count; i++)
                                                {
                                                    var itemIndex3 = string.Format("X{0}", i); var n7 = string.Format("{1}[X{0}].PolicyRefCode", i, prefx4);
                                                    var n8 = string.Format("{1}[X{0}].InsBranchCode", i, prefx4);
                                                    var n9 = string.Format("{1}[X{0}].InsuerLeadCode", i, prefx4);
                                                    var n10 = string.Format("{1}[X{0}].PercentageCover", i, prefx4);
                                                    var n11 = string.Format("{1}[X{0}].isConfirmed", i, prefx4);

                                                    <div class="divTableRow">
                                                        <div class="divTableCell">
                                                            <input name="@prefx6" type="hidden" value="@itemIndex3" />
                                                            @Html.Hidden(n7, Model.Underwriting_InsurerPolicyDistribution[i - 1].PolicyRefCode, new { id = n7 }) <button class="btn-primary btn-xs delbtn" style="background-color: #89006e !important; color: #fff; text-align: center;" type="button"></button>
                                                        </div>
                                                        <div class="divTableCell">
                                                            @Html.DropDownList(n8, new SelectList(Html.InsurerBranchDropDownList(), "InsBranchCode", "FullDescription", Model.Underwriting_InsurerPolicyDistribution[i - 1].InsBranchCode), new { id = n8, @class = "form-control input-sm chosen_select_L" })
                                                            @Html.ValidationMessage(n8, "", new { @class = "text-danger" })
                                                        </div>
                                                        <div class="divTableCell">
                                                            @Html.CheckBox(n9, Model.Underwriting_InsurerPolicyDistribution[i - 1].InsuerLeadCode, new { id = n9, @class = "form-control input-sm" })
                                                            @Html.ValidationMessage(n9, "", new { @class = "text-danger" })
                                                        </div>
                                                        <div class="divTableCell">
                                                            @Html.TextBox(n10, Model.Underwriting_InsurerPolicyDistribution[i - 1].PercentageCover, new { id = n10, @class = "form-control input-sm", @style = "width: 65px;" })
                                                            @Html.ValidationMessage(n10, "", new { @class = "text-danger" })
                                                        </div>
                                                        <div class="divTableCell">
                                                            <div class="form-check">
                                                                @Html.CheckBox(n11, Model.Underwriting_InsurerPolicyDistribution[i - 1].isConfirmed, new { id = n11, @class = "form-check-input" }) @Html.ValidationMessage(n11, "", new { @class = "text-danger" })
                                                            </div>
                                                        </div>
                                                    </div>
                                                }
                                            }
                                            
                                        </div>
                                    </div>
                                    <input type="submit" class="btn btn-primary" value="Add New" onclick="addRow('requestItems'); return false;" />
                                </div>
                            </div>
                            <div class="modal-footer">
                                <button class="btn btn-primary" type="button" data-dismiss="modal">Next</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>



@section scripts {
    <script src="~/Scripts/chosen.jquery.min.js"></script>
    <script type="text/javascript">
  $(document).ready(function () {
        $(".chosen_select_L").chosen({
            width: "100%",
            no_results_text: "Oops, nothing found!",
            disable_search_threshold: 5
        });


    function addRow(dataTable) {
        var table = document.getElementById(dataTable);
        var rowCount = table.rows.length;
        if(rowCount < 500){
            $(".chosen_select_L").chosen('destroy');
            var row = table.insertRow(rowCount);
            row.id = "X" + rowCount;
            var colCount = table.rows[1].cells.length;

            for(var i=0; i<colCount; i++) {
                var newcell = row.insertCell(i);
                newcell.innerHTML = table.rows[1].cells[i].innerHTML.replace(/X1/g, row.id);

                switch (newcell.childNodes[0].type) {
                    case "text":
                        newcell.childNodes[0].value = "";
                        break;
                    case "checkbox":
                        newcell.childNodes[0].checked = false;
                        break;
                    case "select-one":
                        newcell.childNodes[0].selectedIndex = 0;
                        break;
                    case "hidden":
                        newcell.childNodes[0].value = "";
                        break;
                }
            }
        }
        else{
            BootstrapDialog.alert("Maximum rows are 500");
        }

        $(".chosen_select_L").chosen({
            width: "100%",
            no_results_text: "Oops, nothing found!",
            disable_search_threshold: 5

        });

    }
  });
}

Please which one will you recommend? for a Web project? tr/td Table or div Table.

Thanking you in anticipation of your quick response.

Best regards,

Abiodunajai