Make real-time modification

I made a simple script with JQuery that changes some texts in select of sizes in a store:

<select>
    <option value="">Escolha seu tamanho...</option>
    <option value="476" price="0" data-label="p">P</option>
    <option value="473" price="0" data-label="m">M</option>
    <option value="474" price="0" data-label="g">G</option>
    <option value="475" price="0" data-label="gg">GG</option>
</select>

$j(function(){
    $j('option[data-label="p"]').text('P - 34');
    $j('option[data-label="m"]').text('M - 36/38');
    $j('option[data-label="g"]').text('G - 40/42');
    $j('option[data-label="gg"]').text('GG - 44');
});

But, for example, when I choose the size in select , it means that options is updated by pulling child product data.

That is, if I mark "M", it will kind of "refresh the page" (in case I only update select ) and what I put with JQuery will disappear, and only return when I refresh the page again.

I'm still a layman in JQuery, so I thought about creating a loop , but kind of would leave the site slow.

How can I check if the text is the same as I want it or not, in real time, to always be what I put? With Ajax would it work? I am asking because still what I know in Ajax is not enough, so I am not aware.