Practice Real Company Assessment Patterns • Latest 2025–2026 Mock Tests

Programming Exercises

Build a component that highlights a <div> when a checkbox is selected.

Easy

Problem Statement

Build a component that highlights a

when a checkbox is selected.

Sample Output

The <div> has a yellow background when the checkbox is checked.

Limits

Time: 2s · Memory: 256 MB

Code Editor
00:00

Try your code in this preview. Submit marks it done.

import React, { useState } from "react";
 
 const HighlightDiv = () => {
  const [isChecked, setIsChecked] = useState(false);
 
  return (
  <div>
  <input type="checkbox" onChange={(e) => {
  // Update isChecked state
  }} />
  <div
  style={{
  backgroundColor: isChecked ? "yellow" : "transparent",
  width: "200px",
  height: "100px",
  }}
  >
  Highlight me!
  </div>
  </div>
  );
 };
 
 export default HighlightDiv;
Open on CodeSandboxOpen Sandbox