ถามวิธีใช้ Ajax เปลี่ยนรูปภาพทีครับ ตามรูปด้านบน อยากใช้ Ajax เวลาคลิกเลือก emotion 2 หรือ 3 แล้ว ภาพ Emotion

<script>
function fncChange(obj){
	var val =obj.options[obj.selectedIndex].value;
	document.getElementById('boxEmo').innerHTML=document.getElementById('emo'+val).innerHTML;
}
</script>
<select onchange="fncChange(this)">
<option value="1">emotions1</option>
<option value="2">emotions2</option>
</select>
<div id="boxEmo"></div>
<div id="emo1" style="display:none"><img src="img1.jpg"><img src="img2.jpg"></div>
<div id="emo2" style="display:none"><img src="img3.jpg"><img src="img4.jpg"></div>

<script>
function fncChange(obj){
	var foldername =obj.options[obj.selectedIndex].value;
	for(var i=1;i<=2 ;i++){
       var filename=document.getElementById('emo'+i);
       filename.src='emo'+foldername+'/img'+i+'.gif'; 
    }
}
</script>
<select onchange="fncChange(this)">
<option value="1">emotions1</option>
<option value="2">emotions2</option>
</select>
<div id="boxEmo">
   <img src="emo1/img1.gif" id="emo1">
    <img src="emo1/img2.gif" id="emo2">
</div>