When re-initialized, array in object not being reset in console but is reset in window

When re-initialized, array in object not being reset in console but is
reset in window

Overall, I have an object that keeps track of selected checkbox IDs. The
way it does this is by pushing/slicing the IDs into/out of an array,
$Grid.selectedRows. This object also binds a 'refresh' method to a refresh
button.
I have a class that I created that object from, KendoGridSelection. Here
is my code:
JS
var KendoGridSelection = function (gridID, pagerSelector) {
var $Grid = this;
$Grid.selectedRows = [];
$Grid.gridID = gridID;
$Grid.pagerSelector = pagerSelector;
$Grid.grid = $($Grid.gridID).data('kendoGrid');
$Grid.pager = $($Grid.pagerSelector).data('kendoPager');
$Grid.gridCheckboxes = $('input[type=checkbox]', $Grid.gridID);
$Grid.gridRows = $('table tbody tr', $Grid.gridID);
$Grid.refreshButton = $('.refreshButton', $Grid.gridID);
$Grid.bindUIEvents = function () {
$Grid.gridCheckboxes = $('input[type=checkbox]', $Grid.gridID);
$Grid.gridRows = $('.row', $Grid.gridID);
// Row click event
/*$($Grid.gridRows).click(function (e) {
if (!$(e.target).parent().hasClass('k-hierarchy-cell'))
$(this).find('input[type=checkbox]').click();
});*/
// Checkbock click event
$($Grid.gridCheckboxes).click(function (e) {
console.log('checkbox clicked!');
e.stopPropagation();
var $t = $(this);
var checkboxID = $t.attr('id');
var thisRow = $t.closest('tr');
if ($t.is(':checked')) {
thisRow.addClass('k-state-selected');
// add to selected[]
if ($.inArray(checkboxID, $Grid.selectedRows) === -1)
$Grid.selectedRows.push(checkboxID);
} else {
thisRow.removeClass('k-state-selected');
// remove from selected[]
$Grid.selectedRows.splice($.inArray(checkboxID,
$Grid.selectedRows), 1);
}
});
}
$Grid.gridPersistSelected = function () {
$.each($Grid.selectedRows, function () {
var $t = $('#' + this);
if ($t) $t.click();
});
}
$Grid.pagerChange = function () {
$Grid.bindUIEvents();
$Grid.gridPersistSelected();
}
$Grid.refresh = function () {
$Grid.selectedRows = [];
$Grid.gridCheckboxes.attr('checked', false);
console.log('Refresh clicked.');
console.log('$Grid.selectedRows: '+$Grid.selectedRows);
}
// Init
$Grid.pagerChange();
// $Grid.pager.bind("change", $Grid.pagerChange);
// Unbind refresh button, then rebind
// Refresh button
$Grid.refreshButton.click(function(){
console.log('reset!');
$Grid.refresh();
});
$('.seeSelectedRowsArray').click(function(){
console.log($Grid.selectedRows);
});
return {
selectedRows: $Grid.selectedRows,
refresh: $Grid.refresh,
}
}
$(function(){
window.activeThreatsGrid = new KendoGridSelection('.grid', '.pager');
});
HTML
<div class='grid'>
<div class='row'>
<label><input type="checkbox" id="item1"> </label>
</div>
<div class='row'>
<label><input type="checkbox" id="item2"> </label>
</div>
<div class='row'>
<label><input type="checkbox" id="item3"> </label>
</div>
<div class='row'>
<label><input type="checkbox" id="item4"> </label>
</div>
<div class='row'>
<label><input type="checkbox" id="item5"> </label>
</div>
<div class='pager'>
<input type="button" value="refresh" class="refreshButton">
</div>
<div><input type="button" value="seeSelectedRowsArray"
class="seeSelectedRowsArray"></div>
</div>
CSS
.row{background:blue; height:20px; width:100px; margin-bottom:5px;}
JSFiddle
Why does the bound seeSelectedRowsArray button show that I have an empty
array, but when I access the activeThreatsGrid.selectedRows public
property in the console, it still shows I have items in the array (and
also not updated to current values)?
Any help would be appreciated!