Crear nuevos textbox segun opción elegida de un select

[SinAliaS]

Hola:

Estoy intentando hacer que de un select cuando selecciono un numero me cree automaticamente esa cantidad de textbox.

Estoy usando un script que encontre en este mismo foro:

Código:

<script type="text/javascript">
function createTexts(sel) {
    var num = sel.value;
    if( !num ) num = sel.options[sel.selectedIndex].value;
    if( !num ) return;

    var html="<input type=\"text\" name=\"caja_de_texto[]\" />";
    num = parseInt( num );
    var dest = document.getElementById("cajas");
    for( i = 0; i < num; i++ ) {
         dest.innerHTML += html;
    }
}
</script>

Código:

<select name="select1" id="cantidad" onchange="createTexts(this)">
    <option value="" selected="selected">Seleccionar cantidad</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select> 
<div id="cajas"></div>

y funciona a la perfeccion, pero el tema es que necesito aplicar este mismo codigo a 2 combos mas:

Código:

<select name="select2" id="cantidad" onchange="createTexts(this)">
    <option value="" selected="selected">Seleccionar cantidad</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select> 
<div id="cajas"></div>

<select name="select3" id="cantidad" onchange="createTexts(this)">
    <option value="" selected="selected">Seleccionar cantidad</option>
    <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>
</select> 
<div id="cajas"></div>

y ahi ya no funciona y otra cosa que quisiera lograr es que si elijo el valor 2 del select1 aparezcan 2 textbox, pero si vuelvo a seleccionar otro valor de ese mismo select el valor 1 por ejemplo se borren los text que estaban y se cree solo uno.

Espero me puedan ayudar a lograr esto que intento hacer.

Muchas gracias de antemano.