PlutoUI.jl TableOfContents update

Hello.
I use a lot Pluto.jl and PlutoUI.jl for teaching.
Now, I am trying to have a dynamic element in the title.
However, I am having trouble with the update of the TableOfContents

I have defined the function:

function answered(ans::String)	
	if ans == "NR"
		md"""## 🔴

		---
		"""
	else
		md"""## 🟢

		---
		"""
	end
end;

where ans is the resulting object of:

@bind ans Radio(["a)","b)","c)","d)","e)","NR"], default = "NR")

This should give a sense of progress in the Table of Contents when answering a multiple-choice questionnaire.
Each question is preceded by a cell containing:

answered(ans)

This prints the title perfectly well, according to the answer provided.
But the TableOfContents does not update unless I open “the eye” of a cell.
It seems that the JavaScript event observer does not detect a change in the title produced by a function.
Any ideas for a workaround?
Thank you!

The PlutoUI TableOfContents updates itselfs whenever a change in any cell javascript class is observed, as seen from the source:

The cell class changes mostly anytime anything happens in a notebook (e.g. changing code folded, cell running, changing cell code, etc…).
I believe the problem in your case is that the cell with answered(ans) might execute too fast, so the change in class between running and ran happens so fast that the class is not updated.

If you put a short sleep (like sleep(0.05)) in your cell with answered(ans) your cell class should update and the user will not feel much difference for a 50ms sleep (I tried with 10ms but the cell class did not change for 10ms).

Dear @disberd thank you very much! It worked.