Chrome Extension: Navigating and Searching through an iFrame

Question

Good afternoon,

I have a chrome extension that is interacting with an iFrame within the page. The iFrame loads a grid of data, 25 results at a time. There are navigation buttons that refreshes the iFrame with the next/prev set of results.

The goal is to send the content script a value, have the content script navigate the iFrame (through however many pages necessary), and send back a result value to the background script.

I'm having difficulty getting the content script top not return something to the background script before navigating the iFrame and searching for the field.

1) On browserAction, the background script sends a message to the content script:

function resolveMulti(tabID, city){
    message.sendMessage(tabID, {
        "resolvemulti": city
    }, function(response){
        if(response["Details"]=="Property Not Found"){
            console.log('Property Not Found');
        }
        else if(response["Details"]=="No City Match Found"){
            console.log('No City Match Found');
        }
        else if(response["Details"]=="Found"){
            console.log('Found');
        }
    })
    return;
}

2) Content script will respond with the return of the following function:

function resolveMulti(city){

    var results = "No City Match Found";

    //If zero results
    if($("#totalProperties").html()==""){
        return "Property Not Found";
    }


    grid= document.getElementById("grid"); //<-- is iframe
    formGrid= grid.contentWindow.document.getElementById("formGrid");
    totalPages = grid.contentWindow.document.getElementById("totalPages").value;
    currentPage = grid.contentWindow.document.getElementById("currentPage").value;

    while(currentPage<totalPages&&results=="No City Match Found"){
        //code to search for results, which works on each page
        var resultsArray = $("iFrame").contents().find("#gridMain tr[id*='row'] td:nth-child(13)");
        resultsArray.each(function(index){
            if($(this).html().toLowerCase() == city.toLowerCase()){
                results = "Found";
                $(this).click();
                return false;
            }
        });

        $("#nextPageBtn").click();
    }

    return results;

}

I had hoped that the while loop would iterate over:

1. Search Current Grid
2. If found, return results == 'Found'
3. Else, click next button

This is not what happens however. One second I'm on the first page, then I'm on the last page (say, 11), and the background script receives a "No City Match Found" -- although I know the result is located on page 8...

Another issue that sometimes comes up is, the script sometimes tries to run before the iFrame is properly loaded (which raises an error). The script will somehow need to iterate once iFrame is loaded.

How should I go about fixing the function so that the function properly checks every page before returning a result to the background script?

Thank you all!