DEV Community

Muhammad Awais
Muhammad Awais

Posted on

2 1

Applying Classes Conditionally in React

in this example, I have an iterated list of data and i want to apply a class if the index of iteration is even.

so, here is a solution,

data.map((item, index) => {
   return (
     <p key={index} className={ index%2==0 ? "filled" : "no-filled" }> 
       {item.name}
     </p>
   );
})
Enter fullscreen mode Exit fullscreen mode

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay