Javascript help with DOM..does not get updated?

I have a bunch of links stylized like this:

<div id="friend_names_list">

<div class="dropdown_input"><span>1</span><span>Name1</span></div>
<div class="dropdown_input"><span>0</span><span>Name2</span></div>
<div class="dropdown_input"><span>0</span><span>Name3</span></div>
<div class="dropdown_input"><span>0</span><span>Name4</span></div>


</div>

With the following function i want to select the next link after the selected one. Indicated by the 1 in the span:

 function select_friendinbox()
{
    var arr_names=document.getElementById("friend_names_list").getElementsByClassName("dropdown_input");
    var match=0;

    for(var a=0;a<arr_names.length;a++)
    {
        if(arr_names[a].childNodes[0].innerHTML=='1')
{
arr_names[a].childNodes[0].innerHTML='0';
match=a;
}

}


    arr_names[match+1].childNodes[0].innerHTML='1'; 

}

However if i call the function. It does change so that the second name is selected:

<div id="friend_names_list">

<div class="dropdown_input"><span>0</span><span>Name1</span></div>
<div class="dropdown_input"><span>1</span><span>Name2</span></div>
<div class="dropdown_input"><span>0</span><span>Name3</span></div>
<div class="dropdown_input"><span>0</span><span>Name4</span></div>


</div>

But when I call the function again it says match is 0 and selects the second name and not the third. I don't know why this happens maybe its my coding logic or something ;) It appears as if 开发者_StackOverflow社区javascript is not returning the updated dom..and thats why match stays at 0?? Any ideas on how to fix this?

I tested your code here, and it worked (made a small change so that it loops as well because it threw an error)

http://jsfiddle.net/dBhBu/

I'm pretty sure you have to take the var match = 0 outside the select_friendinbox() function. Otherwise every time you call the function it gets set back to 0.