score:0

you should check the element style value to decide the color to apply:

if(e.style.color === "black") '#cccccc' : 'black'

score:2

change your handlechangetextcolor to following:

const handlechnagetextcolor = (e) => {

 settextcolor(textcolor === 'black' ? '#cccccc' : 'black');
}

score:2

you should assign the value of checkbox with some state variable and make the color of the text dependant on the checkbox value. following will surely help you achieve the desired results.

const [textcolor, settextcolor] = usestate('black');
const [isblack, setisblack] = usestate(true);

const handlechnagetextcolor = (e) => {
  setisblack(!isblack);
  settextcolor(isblack ? '#cccccc' : 'black ');
}

return(
  <>
   <label classname="switch">
     <input type="checkbox" value={isblack} onchange={handlechnagetextcolor} />
     <span classname="slider round" />
   </label>
   <small style={{ color:textcolor}} classname="switch-container_text">advanced view</small>
  </>
 )
}

Related Query

More Query from same tag