动态生成XX下拉列表

前提：后台已经写好数据获取方法；
拿我的后台 获取员工信息举例：

    package com.icss.hr.dept.controller;
/**
 * 查询部门列表
 */
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.SQLException;
import java.util.ArrayList;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.google.gson.Gson;
import com.icss.hr.dept.pojo.Dept;
import com.icss.hr.dept.service.DeptService;

@WebServlet("/QueryDeptServlet")
public class QueryDeptServlet extends HttpServlet {

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
		//设置编码
		response.setContentType("text/html;charset=utf-8");
		
		//获得输出流
		PrintWriter out = response.getWriter();
				
		DeptService service = new DeptService();
		try {
			//调用业务层获得数据集合
			ArrayList<Dept> list = service.queryDept();
			
			//json转换
			Gson gson = new Gson();
			String jsonStr = gson.toJson(list);
			out.print(jsonStr);
		} catch (SQLException e) {
			e.printStackTrace();
			
			//手动跳转到错误页
			request.getRequestDispatcher("/500.jsp").forward(request , response);
		}
		
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

改方法最后以字符串形式输出了全部的员工信息：

[{“deptId”:10,“deptName”:“开发部”,“deptLoc”:“北京海淀区”},{“deptId”:40,“deptName”:“外联部”,“deptLoc”:“上海黄浦区”},{“deptId”:230,“deptName”:“公关部”,“deptLoc”:“武汉汉正街”},{“deptId”:240,“deptName”:“人事部”,“deptLoc”:“天津塘沽区”},{“deptId”:490,“deptName”:“公关部”,“deptLoc”:“武汉汉正街”}]

然后前端动态生成该员工信息的下拉列表：

 <div class="form-group">
		<label for="" class="col-sm-2">部门</label>
		<div class="col-sm-8">
				<select name="deptId" id="deptId" class="form-control">
					<option value="">请选择部门</option>
				</select>
		 </div>
  </div>

//动态生成部门列表
				var deptId = $('#deptId');
				$.getJSON(baseUrl + 'QueryDeptServlet',function(data){
					
					htmlStr = '';
					$.each(data,function(index,el){
						
						htmlStr = '';
						htmlStr += '<option value="' + el.deptId + '">' + el.deptName + '</option>';
						
						deptId.append(htmlStr);
					});
					
				});