why doesn't it switch to another fragment?

Question

class MainFragment : Fragment(), BluetoothController.Listener {
    private lateinit var bluetoothController: BluetoothController
    private lateinit var btAdapter: BluetoothAdapter
    private lateinit var binding: FragmentMainBinding

    private var onOff = false

    override fun onCreateView(

        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?,
    ): View {
        binding = FragmentMainBinding.inflate(inflater, container, false)
        return binding.root
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        setHasOptionsMenu(true)
        super.onCreate(savedInstanceState)
    }

    override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
        inflater.inflate(R.menu.main_menu, menu)
        super.onCreateOptionsMenu(menu, inflater)
    }

    override fun onOptionsItemSelected(item: MenuItem): Boolean {

        initBtAdapter()
        val pref = activity?.getSharedPreferences(
            BluetoothConstants.PREFERENCES, Context.MODE_PRIVATE)
        val mac = pref?.getString(BluetoothConstants.MAC, "")
        bluetoothController = BluetoothController(btAdapter)
        try {

            if (item.itemId == R.id.id_color) {
                /*
                activity.let {
                    val intent = Intent(it, ColorGlow::class.java)
                    startActivity(intent)
                }

                 */
                **val fragment = ColorGlow()
                val transaction = fragmentManager?.beginTransaction()
                transaction?.replace(R.id.ColorGlow, fragment)?.commit()
                getChildFragmentManager().beginTransaction().replace(R.id.ColorGlow,  ColorGlow()).commit()
                //view.findNavController().navigate(R.id.ColorGlow)**

               // val i: Intent = Intent(requireContext(), ColorGlow::class.java)
               // startActivity(i)
            }

class ColorGlow : Fragment(), BluetoothController.Listener {
    private lateinit var bluetoothController: BluetoothController
    private var redClick = true
    private var greenClick = true
    private var yellowClick = true
    private var whiteClick = true
    private lateinit var btAdapter: BluetoothAdapter
    private lateinit var binding: ColorGlowBinding



    override fun onCreateView(

        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?,
    ): View {
        binding = ColorGlowBinding.inflate(inflater, container, false)
        return binding.root
    }

FATAL EXCEPTION: main
Process: com.example.bluetoothmoduletest, PID: 24010

java.lang.IllegalArgumentException: No view found for id 0x7f080228 (com.example.bluetoothmoduletest:id/ColorGlow) for fragment MainFragment{ce573fb} (7b27cc86-0fb0-48d2-97db-8426fd364138 id=0x7f080228)
    at androidx.fragment.app.FragmentStateManager.createView(FragmentStateManager.java:547)
    at androidx.fragment.app.FragmentStateManager.moveToExpectedState(FragmentStateManager.java:272)
    at androidx.fragment.app.FragmentManager.executeOpsTogether(FragmentManager.java:1943)