It seems that adding the double quote char
" to the custom HTML tooltip will break the tooltip itself, making the browser think that the tooltip title is over and parsing a chunk of the tooltip title as external HTML.
Here's a jsfiddle.
Updated your code from double quotes to single quotes within the title attribute.
<button type="button" class="btn btn-danger" data-bs-toggle="tooltip" data-bs-html="true" title="<span style=' color : red'>Red Text</span><br><span style='color : green'>Green Text</span>">
The answer of @poo is not working for me, when using classes it gave me the answer you are searching for.
Here is a https://jsfiddle.net/p5bzmqd1/
<button type="button" class="btn btn-danger" data-bs-toggle="tooltip" data-bs-html="true" title="<span class=redToolTip>Red Text</span><br><span class=greenToolTip>Green Text</span>">
I'm a problematic tooltip
</button>