too long

Question

I've two different div's (both dynamically generated) with the same content

CODE TPL:

{foreach from=$rozopt item=r}
<div id="optionsy{$r.optionid}">
{foreach from=$options item=q}
    <option id="{$q.optionid}" value="{$q.optionid}">
        {$q.option_name|escape}
    </option>
{/foreach}
</div>
{/foreach}

RESULT:

<div id="optionsy29216">
    <option id="29218" value="29218">
        wysyłamy w 24 godziny
    </option>
    <option id="31848" value="31848">
        1-3 dni
    </option>
</div>
<div id="optionsy29217">
    <option id="29218" value="29218">
        wysyłamy w 24 godziny
    </option>
    <option id="31848" value="31848">
        1-3 dni
    </option>
</div>

so as You can see i've two div's with different ids but with the same content. Now i want to remove one option, like <option id="29218" value="29218"> but only from one, currently loaded div. This code is from x-cart, and i want to hide variants which are out of stock. /max avail is 0 /

JS CODE:

if (hasOwnProperty(variants[x][1], c)){
        var max_avail = variants[variantid][0][1];
        var sku = variants[variantid][0][5];
        globalSku = sku;
        rozkol = document.getElementsByClassName('rozkol')[0].id;
        id = getPOValue(c); //option id/value
        rozkolv = getPOValue1(rozkol);
         if((max_avail == 0)){  
            element = document.getElementById(id);
            element.parentNode.removeChild(element);
         }
    }

With this code i can remove option but from both divs.

Answer 1

if you use JQuery. you can achieve your goal with this line of code

$({parentdivid}).find({optionid}).remove(); 

div id = optionsy29217 ; option id = 29218

$('#optionsy29217').find('#29218').remove();