'D3 js filter select

I dont knoe exactly what is going on here tried everything to no success, here is my code, i am trying to add color by changing the opacity with the rgba, but i noticed only the first element of the selected(this) is being given the rgba and the rest turns to rgb, please note am talking about the line of that has the style('fill',`rgba(${red}, ${green}, ${blue}, ${i+1 * 0.25}`)

        currentEl.filter(function(d, i, n):any {
            if(bottonValue==='filter-odd') {
                if(i % 2 === 0) {
                    select(this).style('fill',`rgba(${red}, ${green}, ${blue}, ${i+1 * 0.25}`)
                }
                else {
                    select(this).style('fill','rgba(248, 248, 248, 0.5)')
                }
            }
            else if(bottonValue==='filter-even') {
                if(i % 2 !== 0) {
                    select(this).style('fill',`rgba(${red}, ${green}, ${blue}, ${i+1 * 0.25}`,)
                }
                else {
                    select(this).style('fill','rgba(248, 248, 248, 0.5)')
                }
            }
            else
                select(this).style('fill',`rgba(${red}, ${green}, ${blue}, ${i+1 * 0.25}`)
           
        }) 
    }```

below is my code 


[![dom and result image][1]][1]


  [1]: https://i.stack.imgur.com/BhhtW.jpg

Solution 1:^[1]

Well i solved with the help from discord, i needed to add (i+1) and not i+1

select(this).style('fill',`rgba(${red}, ${green}, ${blue}, ${(i+1) * 0.25}`,)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Swiss bobo

'D3 js filter select

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]