var target_id="target";
var trigger_id="trigger";
var current_num = 1; 
var fade_flag = true;

$(document).ready( function() {
	for(i=1;i<=$("[id^="+target_id+"]").length;i++){
		//add class="on" first element
		if(i==1) $("#"+trigger_id+i).addClass("on");
		//hide elements without first element
		else $("#"+target_id+i).hide();
	}
});

function changeName(num){
	//add and remove trigger class
	for(i=1; i<=$("[id^="+target_id+"]").length; i++){
		if(i==num){
			$("#"+trigger_id+i).addClass("on");
		}else{
			$("#"+trigger_id+i).removeClass("on");
		}
	}
}

function elementSwap(num){
	if(fade_flag){
		changeName(num);
		fade_flag = false;
		//fadeOut
		$("#"+target_id+current_num).fadeOut(
			"fast",
			//fadeIn
			function(){
				$("#"+target_id+num).fadeIn();
				current_num = num;
				fade_flag = true;
			}
		)
	}
}