This is my code:

 <xmp class="prettyprint code">
            <div class="first-class">
                <div class="second-class">some text</div>
                <div class="third-class">other text</div>
            </div>
        </xmp>

This is what I see in developer tools:

<xmp class="prettyprint code prettyprinted" style="">
<span class="pln"> </span>
<span class="tag"><div</span>
<span class="pln"> </span>
<span class="atn">class</span>
<span class="pun">=</span>
<span class="atv">"first-class"</span>
<span class="tag">></span>
<span class="pln"> </span>
<span class="tag"><div</span>
<span class="pln"> </span>
<span class="atn">class</span>
<span class="pun">=</span>
<span class="atv">"second-class"</span>
<span class="tag">></span>
<span class="pln">some text</span>
<span class="tag"></div></span>
<span class="pln"> </span>
<span class="tag"><div</span>
<span class="pln"> </span>
<span class="atn">class</span>
<span class="pun">=</span>
<span class="atv">"third-class"</span>
<span class="tag">></span>
<span class="pln">other text</span>
<span class="tag"></div></span>
<span class="pln"> </span>
<span class="tag"></div></span>
<span class="pln"> </span>
</xmp>

And this is what I see on my page:

class="first-class"
class="second-class"  some text
class="third-class"  other text