I have this coding and I think it works. However, I would like to understand if there is a better way to do this. This would automatically create new textboxes or delete them based on the given selected number.<script>    var OLD_CASE_NUMBER = 1;    $(#cornercases).ready(function () {        CORNER_CASE_LOADING();    });    $(#cornercases).change(function () {        CORNER_CASE_LOADING();    });    // FUNCTIONLITY TO CREATE THE DOWNDOWN MENUS     function CORNER_CASE_LOADING() {        var topvalue = $('#cornercases').val();        var counter = 0;        var newvalue = parseInt(OLD_CASE_NUMBER) + 1;        // ADD MORE VALUES IN CASE        if (parseInt(topvalue) == 1 && parseInt(OLD_CASE_NUMBER) == 1)        {            var counter = 1;        var newTextBoxDiv = $(document.createElement('div')).attr(id, 'TextBoxDiv' + counter);            newTextBoxDiv.html('<label>Textbox #'+ counter + ' : </label><input type=text name=textbox' + counter + ' id=textbox' + counter + ' value= >');        newTextBoxDiv.appendTo(#div_selection_section);        }        if (newvalue <= topvalue)        {            for (counter=newvalue;counter<=topvalue;counter++)            {            var newTextBoxDiv = $(document.createElement('div')).attr(id, 'TextBoxDiv' + counter);                newTextBoxDiv.html('<label>Textbox #'+ counter + ' : </label><input type=text name=textbox' + counter + ' id=textbox' + counter + ' value= >');            newTextBoxDiv.appendTo(#div_selection_section);            }        }        else if (parseInt(OLD_CASE_NUMBER) > parseInt(topvalue))        {            for (counter=10;counter>topvalue;counter--)            {               $(#TextBoxDiv + counter).remove();            }        }        OLD_CASE_NUMBER = topvalue;        }</script><select id=cornercases name=cornercases>     <option value=1>1</option>    <option value=2>2</option>    <option value=3>3</option>    <option value=4>4</option>    <option value=5>5</option>    <option value=6>6</option>    <option value=7>7</option>    <option value=8>8</option>    <option value=9>9</option>    <option value=10>10</option></select><div id='div_selection_section'></div>
Adding/remving dynamically text boxes
javascript;jquery
$(document.createElement('div')). ...is the same as:$('<DIV></DIV>'). ....you can just build uppon your previus jQuery statements:$('<DIV></DIV>')    .attr('id','lol')    .html('hey hey')    .appendTo(#div_selection_section);$(#cornercases).change(function () {        CORNER_CASE_LOADING();    });is the same as:$(#cornercases).change(CORNER_CASE_LOADING);and you can bind 2 events in one with jQuery so:$(#cornercases).bind(change ready,CORNER_CASE_LOADING)you might want to parsInt topvalue in the line with te varvar topvalue = parseInt($('#cornercases').val());you will not need to repeat pareInt in each 'if' if you do that.Also, I see that OLD_CASE_NUMBER is an integer (and if you do what is mesioned above), you won't need to parse that eitheras far as I see the second line of your function var counter = 0; is useless, because everywhere you use counter you first set it to something else