Algorithm design for a js loop structure
<p>I got an array <code>[1,2,3,4]</code></p>

<p>I need first to run over [2] that was chosen, set his styles, <strong>and than after</strong> run over the other children and reset their styles. </p>

<p>At the moment, <strong>my algorithm</strong> is as following:</p>

<pre><code>for item in array
    if item == chosenEl
        set chosen classes
for item in array
    if item != chosenEl
        reset chosen classes for the rest of the children 
</code></pre>

<p>Or <strong>coffe</strong>:</p>

<pre><code>for item in @array
    if item.element is element
        item.selected = true
        item.element.classList.add @selectedClass
        item.element.focus()
for item in @array
    if item.element isnt element
        item.selected = false
        item.element.classList.remove @selectedClass
</code></pre>

<p>I need to design the function like that, and not as a simple forElse loop, due to some restrictions in me framework.</p>

<p>How can I improve this code?</p>

<p>Thank you.</p>

<p><strong>Explanation</strong>- The reason I need this design, is due to duplicated calls for 2 different functions, that conflict one the other.</p>

<p>I'm developing an app for LG TV. The LG TV has its own libraries. Now in my function I set the styles of chosen elements. Byt when I focus to the chosen element, I activate the LG TV onFocus listener, which in his turn control the selected styles.</p>

<p>So when I loop the second or third child, I set again the selected styles, of cleared elements. TLDR but thats how the loops conflicting each other. One interrupting the work of other.</p>

<p>The code was not written by me. I entered an existing project, and I havent written this function, so i cannot just remove the Focus() function. </p>
