d3.js - D3 - ternary operator to set class name

Question

I have a plunker here - https://plnkr.co/edit/qDi8bm3xh3hdaV059AXX?p=preview

I have a chart with two sets of bars.

The bars are coloured using a ternary operator and colours from an array.

I'd like to set an opacity and fill pattern on the bars so need to add classes to the bars.

How can I use the ternary operator to add classes to the bars.

.style('fill', (d, i) => {
    return i % 2 ? colors[1] : colors[0]
})

Answer 1

.attr('class', (d, i) => {
    return i % 2 ? 'bar-fill' : 'bar-opacity'
})