jquery - jQueryは、特定のパターンの要素のすべてのクラスを別のクラスに置き換えます

Question

多くのdivを含むdivがあります。これらのすべてのサブディビジョンには、特定の命名パターンに一致する多数のクラスがあります。「tile1Full」、「tile1Thumb」、「BG1Full」、「BG1Thumb」などの名前のクラスがたくさんあります。したがって、私のhtmlは次のようになります。

<div id=parent>
    <div>
        <div class='tile1Full BG2Full border1'>
    </div>
    <div>
        <div class='tile3ContainerFull border1'>
            <div class=tile2x2Full border3></div>
        </div>
    </div>

名前に「Full」が含まれるすべてのクラスを対応する「Thumb」に置き換えたいので、結果は次のようになります。

<div id=parent>
    <div>
        <div class='tile1Thumb BG2Thumb border1'>
    </div>
    <div>
        <div class='tile3ContainerThumb border1'>
        <div class=tile2x2Thumb border3></div>
    </div>
</div>

これが私が思いついたものです：

contents.find('div').each(function (i) {
    if ($(this).attr('class')!==undefined)
    {
        $(this).attr('class',$(this).attr('class').replace(/Full/g,'Thumb'));
    }
});

問題は、Firefox の「Inspect Element」によると、class 属性を見ると、新しいクラス名があることです。しかし、CSS インスペクタを見ると、これらのクラスは実際には適用されていません。予想どおり、「Full」クラスは適用されなくなりましたが、「Thumb」クラスも適用されません。

クラスが行うことの 1 つは、div の幅と高さを設定することです。div 自体にはコンテンツが含まれていません。新しいクラスが適用されていないため、すべての幅と高さが 0 になり、事実上消えます。

属性インスペクターは目的のクラスがあると報告するのに、CSS インスペクターはそれらのクラスが適用されていないと表示するのはなぜですか?

ありがとう