How to implement the appearance of tags in a separate block when selecting them in select?

Question

css

How to implement the appearance of tags in a separate block when selecting them in the select, given that after the tag appears in the block, this tag disappears in the select list. Well, if you remove this tugs, does it appear back in the select?

Answer 1

Write a lot of code.
You need to hang js on the onchange event of the select.
In this js, you will form a list of tags depending on the selection in the select and assign the disabled property to the selected options. This will not remove the option from the list, but it will be impossible to select it, you can also change its css, for example, make the text color light gray, as a visual confirmation of the impossibility of selection.
Another js you need to put on the onclick of the delete tag button. Here we do the manipulations with the options in the reverse order.
Something like this...