Create Chrome Storage Sync Get Array [on hold]

Currently I have a working function that individually goes through, obtains the set synced data in Chrome and then sets the value of a corresponding ID element with the returned value of the get process.

function getSettings() {
    chrome.storage.sync.get("streamSelect", function (result) {
        var element = document.getElementById('streamSelect');
        element.value = result.streamSelect;
    });

    chrome.storage.sync.get("volumeSlider", function (result) {
        var element = document.getElementById('volumeSlider');
        element.value = result.volumeSlider;
    });

    chrome.storage.sync.get("volumeBar", function (result) {
        var element = document.getElementById('volumeBar');
        element.value = result.volumeBar;
    });

    chrome.storage.sync.get("currentSegment", function (result) {
        var element = document.getElementById('currentSegment');
        element.value = result.currentSegment;
    });

    chrome.storage.sync.get("nowPlaying", function (result) {
        var element = document.getElementById('nowPlaying');
        element.value = result.nowPlaying;
    });

    chrome.storage.sync.get("lastPlayed", function (result) {
        var element = document.getElementById('lastPlayed');
        element.value = result.lastPlayed;
    });

    chrome.storage.sync.get("quickLinks", function (result) {
        var element = document.getElementById('quickLinks');
        element.value = result.quickLinks;
    });

    chrome.storage.sync.get("desktopNotifications", function (result) {
        var element = document.getElementById('desktopNotifications');
        element.value = result.desktopNotifications;
    });
}

I have then tried to convert this into an array to perform the same function but in a much smaller footprint, however I am running into issues and this is not returning the same results as the expanded code presented above. As it executes up to the chrome.storage.sync.get line, but then fails from there after.

function getSettings2() {
    var items = ["streamSelect", "volumeSlider", "volumeBar", "currentSegment", "nowPlaying", "lastPlayed", "quickLinks", "desktopNotifications"];

    for(var i = 0, length = items.length; i < length; i++) {
        selectedItem = items[i];
        chrome.storage.sync.get(selectedItem, function (result) {
            var element = document.getElementById(selectedItem);
            element.value = result.selectedItem;
        });
    };
}

Any help to find a fix to this would be much appreciated, as I have a range of places which have expanded code that I wish to condense into smaller array functions.