That is the way it is supposed to be.
A class is a tag attribute.
Look at the top section of your screen shot, it lists thee tag that will be used for each style, for example the the blueText style will use a span element.
Look at the bottom section, it shows:
type = tag attribute
Setting = class
value = blueText
this means that when you select text in the editor, and apply the blueText style to it, it will wrap the selected text with a span tag that has the blueText class applied to it:
<span class="bluetext>selected text</span>
in the top section, you could change the element to div instead if you like to use a div tag:
<div class="blueText>selected text</div>