I found out a first step: The menus and menuitems in the context menus don't have the classes menu-iconic or menuitem-iconic. They place the icons I defined with CSS to the entries. So the next question is how I can add these classes to the entries. For one CSS-ID I tested:

setTimeout(function() {

var ucjsAC = { init : function () { var d = document.getElementById("mailContext-editAsNew"); d.className += "menu-iconic"; }, } ucjsAC.init(); }, 1000);

and look there - the first icon is in a context menu :-D Now I cannot write this function for each and every menu entry and I don't have a clue of Javascript programming, I only can try to put together examples from others. I'd need a script that cycles through all menus and assigns the menu-iconic class menu entries and to all menuitems the menuitem-iconic class.

But I wonder why the Thunderbird team did not assign these classes to the menu entries

This https://www.digitalocean.com/community/tutorials/how-to-access-elements-in-the-dom description lead me to a solution. I don't know whether it will have unwanted side effects, at the moment it has the wanted effect.

This little code does what I wrote in the previous post and the icons provided by CSS code and grafik files are displayed in front of the context menus in Thunderbird :-)

Edit: I have added to the code to prevent menu entries that already have the needed CSS class to get a wrong class name. This code now also works in Firefox.

setTimeout(function() { var ucjsAC = { init : function () { const menu = document.querySelectorAll('menu'); menu.forEach(query => { if (query.className != 'menu-iconic') query.className += 'menu-iconic'; }); const menuitem = document.querySelectorAll('menuitem'); menuitem.forEach(query => { if (query.className != 'menuitem-iconic') query.className += 'menuitem-iconic'; }); }, } ucjsAC.init(); }, 1000);