<script>
$.ready(){
	var buttons = document.querySelectorAll('button');
	var ps = document.querySelectorAll('p');
	
	for(var i=0; i<buttons.length; i++){
		buttons[i].index = i;
		buttons[i].onclick = function(){
			console.log(this.index);
			
			for(var i=0; i<buttons.length; i++){
 

				buttons[i].className = '';
				ps[i].className = '';
			}
		
			this.className = 'active';
			ps[this.index].className = 'active';
		}
	}
}
</script>

使用let簡化this.index = i操作

for(let i=0; i<buttons.length; i++){
		buttons[i].index = i;
		buttons[i].onclick = function(){
			for(let i=
 
0; i<buttons.length; i++){
				buttons[i].className = '';
				ps[i].className = '';
			}
		
			this.className = 'active';
			ps[i].className = 'active';
		}
	}