function hideStock(){ var selected = document.getElementById("stk"); var hidden = document.getElementById("pa_color"); if (selected.onchange=="stock") { hidden.style.display = "none"; } } <table class="variations" cellspacing="0"> <tbody> <tr> <td class="label"><label for="pa_pricing">Pricing</label></td> <td class="value"> <select id="pa_pricing" class="" name="attribute_pa_pricing" data-attribute_name="attribute_pa_pricing" data-show_option_none="yes" onchange= "getSelectValue(this.value);"> <option value="">Choose an option</option> <option value="retail" >Retail</option> <option value="stock" id = "stk" >Stock</option> </select> </td> </tr> <tr> <td class="label"><label for="pa_color">Color</label></td> <td class="value"> <select id="pa_color" class=" " name="attribute_pa_color" data-attribute_name="attribute_pa_color" data-show_option_none="yes"> <option value="" >Choose an option</option> <option value="aqua" >Aqua</option> <option value="black" >Black</option> <option value="mixed" >Mixed</option> </select> <a class="reset_variations" href="#">Clear</a> </td> </tr> </tbody> </table>intentalo:
var selected = document.getElementById("stk"); var hidden = document.getElementById("pa_color"); selected.addEventListener('change', _ => { if (selected.value == "stock") { hidden.style.display = "none"; } }