Cambiar imagenes segun radio activado

[lynxstyle]

Estoy intentando hacer que una imagen cambie segun los botones radios activos, tengo ya el código para hacer que una imagen cambie, el problema me viene en que son tres grupos de radio y no se como cambiar la funcion para que actue sobre los tres. Os dejo el código que tengo.

Javascript:

Código Javascript:

<script type="text/javascript">
    function anadir(obj) {
            anadir1(obj);
            if (obj.name =='search_query1'){
            anadirImgSQ1();}                        
        }
    
    function anadir1(obj) {     
            var radios = document.getElementsByTagName('input');
            var value;
            obj.form.search_query.value = "";
            for (var i = 0; i < radios.length; i++) {
                if (radios[i].type === 'radio' && radios[i].checked) {
                value = radios[i].value;  
                obj.form.search_query.value = obj.form.search_query.value + value;                          
                }
            }                       
        }
    function anadirImgSQ1(){
            var radio = document.getElementsByName('search_query1');
            var colorPelo = document.getElementById('colorPelo');  
            if (radio[0].checked){
                colorPelo.src = "http://ritsi.org/wp-content/uploads/2013/03/luis_cabeza_honorifico.jpg";
            }
            if (radio[1].checked){
            colorPelo.src = "http://entimg.msn.com/i/150/Movies/Actors4/brigged0194557_150x200.jpg";
            }
        }
</script>
 

Código HTML:

Código HTML:

<div id="personalshoppers">
    <div id="personalshoppers_left">
 
        <div id="search_block_left" class="block exclusive">
            <form name="formulario" method="post" action="{$link->getPageLink('search', true)}" id="searchbox">
                <p class="block_content">
                    <label for="search_query_block">{l s='Enter a product name or description.' mod='blocksearch'}</label>
                    <input type="hidden" name="orderby" value="position" />
                    <input type="hidden" name="controller" value="search" />
                    <input type="hidden" name="orderway" value="desc" />
               
                    <!-- Selectores Personal Shoppers -->  
                <div>
                    <input type="radio" name="search_query1" value="moreno " onchange="anadir(this)" />Moreno
                    <input type="radio" name="search_query1" value="Rubio " onchange="anadir(this)" />Rubio
                </div>
                <div>
                    <input type="radio" name="search_query2" value="con curvas " onchange="anadir(this)"/>con Curvas
                    <input type="radio" name="search_query2" value="atletica " onchange="anadir(this)" />Atl&eacute;tica
                </div>
                <div>
                    <input type="radio" name="search_query3" value="atrevida " onchange="anadir(this)" />Atrevida
                    <input type="radio" name="search_query3" value="elegante " onchange="anadir(this)" />Elegante
                </div>
                           
                    <input class="search_query" type="text" id="search_query_block" name="search_query" value="" />
                    <input type="submit" id="search_button" class="button_mini" value="{l s='Go!' mod='blocksearch'}" />
                </p>
            </form>
        </div>
 
    </div>
    <div id="personalshoppers_right">
        <div id="cabello"><img name="colorPelo" id="colorPelo" src="http://images.luisaviaroma.com/small58I/B0E/010_99a6f5e4-33f3-4afd-9681-19acc7f7c2d6.JPG" > </div>
        <div id="silueta"></div>
        <div id="estilo"></div>
    </div>
</div>
 

en los div de cabello, silueta y estilo se mostrarían las imágenes que además cambiaran según los botones radios seleccionados.