jquery - Access to Javascript variable after it was initialized by ViewBag -

here action function:

public actionresult translatorform() {     string[] arrdepartment = new string[]{"engeneering","science","mediciene"};      viewbag.department = arrdepartment;     return partialview("translatorformpartial"); } 

here jquery function:

 $(document).ready(function () {     var departments = "@viewbag.department";  }); 

as can see store passed data sever viewbag.department in departments javascript variable.at point want create drop-down list , populate using data in departments variable.

but don't how access elements in departments javascript variable. idea how can implement it?

assign viewbag property javascript array using

var departments = json.parse('@html.raw(json.encode(viewbag.department))'); 

then can access normal loop or using jquery .each() function, example

for (i = 0; < departments.length; i++) {      var dept = departments[0]; // returns `engeneering` }