How to build a list of unique values from a grid?

My form has 2 grids on it. When you select a record from the first grid, it will populate the second grid with related records. This secondary grid has a "PEERGROUP" column, and would contain values like "1", "2", etc.

I need to ensure that a user has selected at least 1 record belonging to every group.

I'm stuck on trying to build a list containing unique Group ID values:

function CheckSelectionForGroups(gridName)
{
    //Get rows in grid
    var view = $('#' + gridName).data('kendoGrid').dataSource.view();
    //Array to store the all distinct groups in the grid
    var listOfGroups = [];
    var listIndex = 0;
    //Loop over the rows in the grid
    for (var i = 0; i < view.length; i++)
    {
        //If the group is found in our list already, do nothing
        if (listOfGroups[view[i].PEERGROUP])
            continue;
        //If the group was not found in our list, add it to the list.
        listOfGroups[listIndex] = view[i].PEERGROUP;
        listIndex = listIndex + 1;
    }
    //TODO - Loop over user selection 
    //    and compare groups against list of groups
}

And here is a screenshot of some values:

(Note: The array is incomplete, because if I take a screenshot after processing the next row, it would incorrectly contain 3 values: "1", "1", and "2")

So in this case, I want listOfGroups to only contain the values "1" and "2". The if statement inside my for loop never evaluates to true. I suspect Javascript is casting "1" to a 1 and is trying to pull the element from listOfGroups at index 1. But I don't know how to fix that?