This is a more conceptual question. I recently discovered that I was more confident in this kind of html (example)

<div id="mainCont">
  <div id="mainContFirst">Text <span id="mainContFirstSpan">option</span></div>
  <div id="mainContSecond">Other Text</div>
</div>

Having all the important tags marked with an identifier, you can easily write css:

#mainContFirst {} etc

Is this a bad grade? Should I use only css selector? Is it faster than using a selector?

thank

Grouping (editing)

Okay now. About elements that should have the same style?

let's say, for example, in each div, the second <span>should have font-size:10px;, this is better:

<div>
   text text <span></span> <span id="firstDivSpan"></span>
</div>
 <div>
   text text <span></span> <span id="secondDivSpan"></span>
</div>

and then css:

#firstDivSpan, #secondDivSpan {...}

Or how is it?

 <div>
   text text <span></span> <span id="firstDivSpan" class="commonStyle"></span>
</div>
 <div>
   text text <span></span> <span id="secondDivSpan" class="commonStyle"></span>
</div>

.commonStyle{...}

What's better?