我的循环有问题 - Twitch Streamers？

Question

我正在使用Twitch Streamers应用程序（freecodecamp项目），我必须在线应用程序和离线用户。我认为我为数组中的每个用户名编写循环的方式有问题，因为每次我按下在线或离线按钮时，它都会循环并创建另一个用户列表。谁能告诉我如何解决它？谢谢！这是我的JS代码：

<form method="post" name="areaform" id="areaform">
	<select name="city" id="city_1" onchange="checkCity(this);">
		<option value="city1">
			city1
		</option>
		<option value="city2">
			city2
		</option>
		<option value="city3">
			city3
		</option>
	</select>
	<br />
	<br />
	<textarea name="description" id="description_1" cols="" rows="" style="width:150px; height:50px;">
	</textarea>
	<select name="city" id="city_2" onchange="checkCity(this);">
		<option value="city1">
			city1
		</option>
		<option value="city2">
			city2
		</option>
		<option value="city3">
			city3
		</option>
	</select>
	<br />
	<br />
	<textarea name="description" id="description_2" cols="" rows="" style="width:150px; height:50px;">
	</textarea>
	<select name="city" id="city_3" onchange="checkCity(this);">
		<option value="city1">
			city1
		</option>
		<option value="city2">
			city2
		</option>
		<option value="city3">
			city3
		</option>
	</select>
	<br />
	<br />
	<textarea name="description" id="description_3" cols="" rows="" style="width:150px; height:50px;">
	</textarea>
</form>
<script src="http://code.jquery.com/jquery-1.11.1.min.js">
</script>
<script type="text/javascript">
	
function checkCity(obj) {
    var cid = $(obj).attr('id');
    var id = cid.substr(5);
    ct = $("#"+cid+" option:selected").val();
    if(ct=="city2") {
        document.getElementById("description_"+id).disabled=true;
    }else{
    document.getElementById("description_"+id).disabled=false;
    }
}
 
</script>

以下是我项目草稿的链接：https://codepen.io/cmtran/pen/QgXbWK