Issue with Sorting Dataable Date - datatables

Question

I've been trying to sort a datatable date column, and I've not been able to successfully get it to work. I've researched and looked at several examples with no luck. The date always sort incorrectly.
The script:
table = $('#FindUserTable')
.on('search.dt', function () {
})
.on('page.dt', function () {
var info = table.page.info();
setTablePaging(info);
})
.on('length.dt', function (e, setting, len) {
var info = table.page.info();
setTablePaging(info);
})
.DataTable({
'paging': true,
responsive: true,
"autoWidth": false,
"language": {
"paginate": {
"next": "<i class='fa fa-chevron-right' style='color:#fff;'></i>",
"previous": "<i class='fa fa-chevron-left' style='color:#fff;'></i>"
}
},
"columnDefs": [
{ "orderable": false, "targets": 3 },
{
type : "date",
"targets": 2,
render: $.fn.dataTable.moment('MM/DD/YYYY')
}
],
"fnDrawCallback": function (evnt) {
$('.dataTables_info').addClass('Hidden');
var rows = $("#FindUserTable").dataTable().fnGetNodes();
var noRecordFound = $('.NoRecordFound ');
if (rows.length === 0 && noRecordFound.length === 1) {
$('.dataTables_empty').text('No record found.');
} else if (rows.length === 0 && noRecordFound.length === 0) {
$('.dataTables_empty').addClass('Hidden');
}
if ($('#FindUserTable_paginate ul.pagination li.paginate_button').size()> 2) {
$('#FindUserTable_paginate')[0].style.display = "block";
} else {
$('#FindUserTable_paginate')[0].style.display = "none";
}
}
});
<table class="table table-responsive table-condensed" id="FindUserTable>
<thead>
<tr role="row"><th style="width:30%" class="sorting_asc" tabindex="0" aria-controls="FindUserTable" rowspan="1" colspan="1" aria-sort="ascending" aria-label="
User Last Name: activate to sort column descending">
<label class="dataTableLabel"> User Last Name</label>
<br>
<div style="padding-bottom:.75em;">
<input class="form-control fullWidth" id="LastName" name="LastName" type="text" value="">
</div>
</th><th style="width:30%" class="sorting" tabindex="0" aria-controls="FindUserTable" rowspan="1" colspan="1" aria-label="
User First Name
: activate to sort column ascending">
<label class="dataTableLabel"> User First Name</label>
<br>
<div style="padding-bottom:.75em;">
<input class="form-control fullWidth" id="FirstName" name="FirstName" type="text" value="pat">
</div>
</th><th style="width:20%" class="sorting" tabindex="0" aria-controls="FindUserTable" rowspan="1" colspan="1" aria-label="
Date Of Birth:
activate to sort column ascending">
<label class="dataTableLabel">Date Of Birth</label>
<br>
<div style="padding-bottom:.75em;">
<input class="form-control fullWidth" data-val="true" data-val-date="The field DOB must be a date." id="DateOfBirth" name="DOB" type="text" value="">
</div>
</th><th style="width:20%; padding-bottom:.7em" rowspan="1" colspan="1">
<a id="searchUser" name="searchUser"><i class="glyphicon glyphicon-search fa-2x"></i></a>
</th></tr>
</thead>
<tbody class="findUserbody">
<tr role="row" class="odd">
<td style="text-align: center;" class="sorting_1"><div class="findUserData"> <input data-value="44" id="44" name="SelectedUser" type="radio" value="44"> Four </div></td>
<td style="text-align: center; "><div class="findUserData">User</div></td>
<td style="text-align: center; "><div class="findUserData"> 05/29/1996</div></td>
<td></td>
</tr><tr role="row" class="even">
<td style="text-align: center;" class="sorting_1"><div class="findUserData"> <input data-value="41" id="41" name="SelectedUser" type="radio" value="41"> One </div></td>
<td style="text-align: center; "><div class="findUserData">User</div></td>
<td style="text-align: center; "><div class="findUserData"> 07/31/2000</div></td>
<td></td>
</tr><tr role="row" class="odd">
<td style="text-align: center;" class="sorting_1"><div class="findUserData"> <input data-value="43" id="43" name="SelectedUser" type="radio" value="43"> Three </div></td>
<td style="text-align: center; "><div class="findUserData">User</div></td>
<td style="text-align: center; "><div class="findUserData"> 10/06/1996</div></td>
<td></td>
</tr><tr role="row" class="even">
<td style="text-align: center;" class="sorting_1"><div class="findUserData"> <input data-value="42" id="42" name="SelectedUser" type="radio" value="42"> Two </div></td>
<td style="text-align: center; "><div class="findUserData">User</div></td>
<td style="text-align: center; "><div class="findUserData"> 05/28/2000</div></td>
<td></td>
</tr></tbody>
</table>

Answer 1

The issue was with the tds that have the dates. There was a div inside the TD which was causing the problem. During sorting, the div is also included as part of the date, and moment.js could not understand the date.