How to manipulate ListItem in a ListView directly from functions?

I tried to use the Alloy ListView Guide metal element to prototype some background color manipulation functions. The logic is to loop through all the items within a ListView. For each of the item, I want to set the background color to red if the mass value >= 2, otherwise, the background should be black. I trigger the colorchange with a "Refresh Background Color" button to show the problem. When accessing the list item by getItemAt, I got "null"? Please help!

Logs of the code : console.log(ttlitemlength) --> [INFO] : 3 console.log(currsection) --> [INFO] : [object elementSection] console.log(curritem) --> [INFO] : <null>

[ERROR] : message = "'undefined' is not an object (evaluating 'curritem.symbol')"; [ERROR] : name = TypeError; [ERROR] : sourceId = 299665632;

OS - Mac Yosmite Target IOS Titanium Studio, build: 3.4.1.201410281727

index.js
 
function refreshColor() {
    var ttlitemlength = $.elementList.sections[0].items.length;
    console.log(ttlitemlength);
 
    var currsection = $.elementList.sections[0];
    console.log(currsection);
 
    for ( i = 0; i < ttlitemlength; i++) {
 
        var curritem = currsection.getItemAt[i];
        console.log(curritem);
 
        // Update the item's symbol property and set it's background color to red if mass > 2:
 
        if (parseFloat(curritem.mass.text) >= 2) {
            curritem.symbol.backgroundColor = 'red';
        } else {
            curritem.symbol.backgroundColor = 'black';
        };
 
        currsection.updateItemAt[i, curritem];
 
    };
};
 
$.navWin.open();
 
 
 
index.xml
<Alloy>
<NavigationWindow class="container" id="navWin" platform="ios">
    <Window class="container">
 
        <RightNavButton platform='ios'>
            <Button id='refresh_btn' onClick="refreshColor">Refresh Background Color</Button>
        </RightNavButton>
 
        <ListView id="elementList" defaultItemTemplate="elementTemplate" onItemclick="handleClick">
            <Templates>
                <ItemTemplate name="elementTemplate">
                    <Label bindId="symbol" id="symbol" />
                    <View id="atomProperties">
                        <Label bindId="name" id="name" />
                        <View id="secondLine">
                            <Label class="line2 fieldLabel" text="Number: " />
                            <Label class="line2" bindId="number" id="number" />
                            <Label class="line2 fieldLabel" text="Atomic Mass: " />
                            <Label class="line2" bindId="mass" id="mass" />
                        </View>
                    </View>
                    <ImageView bindId="image" id="image" />
                </ItemTemplate>
            </Templates>
            <ListSection id="elementSection">
                <ListItem symbol:text="H" symbol:color="#090" name:text="Hydrogen" number:text="1" mass:text="1.00794"/>
                <ListItem symbol:text="He" symbol:color="#090" name:text="Helium" number:text="2" mass:text="4.002602"/>
                <ListItem symbol:text="Li" symbol:color="#090" name:text="Lithium" number:text="3" mass:text="6.941"/>
            </ListSection>
        </ListView>
        </Window>
</NavigationWindow>
</Alloy>
 
 
index.tss
"#elementList": {
    top: '0dpi'
},
"#symbol": {
    left: 15,
    color: "black",
    font: { fontSize: 34, fontWeight: 'bold' }
},
"#symbol[platform=android]": {
    left: 0
}
"#atomProperties": {
    top: 0, left: 80, right: 0, bottom: 0,
    layout: "vertical"
},
"#atomProperties[platform=android]": {
    left: 65
},
"#name": {
    left: 0, top: 4,
    color: "black",
    textAlign: Ti.UI.TEXT_ALIGNMENT_LEFT,
    font: { fontSize: 16 }
},
"#secondLine": {
    left: 0, right: 0,
    layout: "horizontal"
},
".fieldLabel": {
    color:"#999"
},
".line2": {
    font: { fontSize: 10 }
},
"#number": {
    width: 30,
    color: 'red'
},
"#mass": {
    color: "blue"
}