Una breve explicación sobre el código a continuación:
En JSFiddle, mi código funciona, pero cada vez que lo transfiero a mi sitio web, aparece Uncaught: TypeError. Proporcione sus sugerencias para resolver TypeError.
$('#myButton').on('click', function() { var op1 = document.getElementById("op1").value; alert(op1); var op2 = document.getElementById("op2").value; alert(op2); if (op1 =='a'){ $("#op2").html("<select id='op2'><option value='800'>800</option><option value='3000'>3000</option></select>"); } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select id="op1" > <option value="a">a</option> <option value="b">b</option> <option value="all">all</option> </select> <select id="op2"> <option value="1">1</option> <option value="11">11</option> </select> <input type="submit" value="button" id="myButton" class="buttonClass" />Su secuencia de comandos debe colocarse en la etiqueta <head></head> y debe cargarse antes que su secuencia de comandos.
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="yourLocalPath.js"></script> </head> <body> <select id="op1" > <option value="a">a</option> <option value="b">b</option> <option value="all">all</option> </select> <select id="op2"> <option value="1">1</option> <option value="11">11</option> </select> <input type="submit" value="button" id="myButton" class="buttonClass" /> </body> </html>