Going through a object with a variable
<p>I guess I didnt really know how to ask this question for me to find an answer. </p>

<p>So I have three variables that are going to make this function do what it has to</p>

<pre><code>    function gatherDataForGeographic(ele) {
        var $this = $(ele)
        var $main_title = $this.find('.options-title'),
            $option = $this.find('.option');
        var arr = []
        var reportAreas = reportManager.getReportAreasObject();


        $option.each(function () {
            var $this = $(this)
            var $checkbox = $this.find('.checkbox');
            var type = $this.data('type'),
                index = $this.data('index');

            if ($checkbox.hasClass('checkbox--checked')) {
                console.log(reportAreas.type)
            } else {
                return true;
            }
        })
        return arr;
    }
    //this will return an object that I need to index  
    var reportAreas = reportManager.getReportAreasObject();

    //this will get the a key that i need from the object 
    var type = $this.data('type');

    //this will give me the index I need to grab
    var index = $this.data('index');
</code></pre>

<p>So what I am trying to do is go through the object based on the type(or key) from the option selected by a user</p>

<p>The problem...
It is looking for <code>reportArea.type[index]</code> and is not recognizing it as a variable and I keep getting <code>undefined</code> because .type does not exist. </p>

<p>Is there a way for it to see that type is a variable and not a key? </p>