Why is function return value undefined when returned in a loop?

Question

I can't figure out why this is happening.

The following function always returns undefined. Even when the condition is satisfied and a value should be returned.

Here is an instance of the answerCollection variable.

[
Object
Answer: "2"
AnswerText: undefined
OpsID: "24"
PprID: "2"
Question: "How many colors?"
__proto__: Object
]

.

function GetAnswerForProcessQuestion(pprID)
    {
        $.each(answerCollection, function (index, item)
        {
            var thisPprID = item["PprID"];
            if (thisPprID == pprID)
            {
                var answer = item["Answer"];
                return answer;
            }
        });
    }

However, if I set a variable inside the loop, then return that variable once the loop finishes executing, the correct value is returned.

function GetAnswerForProcessQuestion(pprID)
    {
        var answer;
        $.each(answerCollection, function (index, item)
        {
            var thisPprID = item["PprID"];
            if (thisPprID == pprID)
            {
                answer = item["Answer"];
            }
        });
        return answer;
    }

Any ideas on why I can't return a value from inside the loop?

Answer 1

Returning a value from $.each does not return the value from the parent function. Try doing it this way:

function GetAnswerForProcessQuestion(pprID)
    {
        var answer;
        $.each(answerCollection, function (index, item)
        {
            var thisPprID = item["PprID"];
            if (thisPprID == pprID)
            {
                answer = item["Answer"];
                return false; // break loop
            }
        });
        return answer;
    }