We Keep Coding

JavaScript TypeError only in IE 11

When loading a js e-form in IE getting an error 'loadForm: if GroupDocList>0: TypeError: Unable to get property 'length; of undefined or null reference
This only occurs in IE not Chrome or Edge.
This form was coded by someone else and I don't have much experience with JS
Update * Through debugging I was able to find that it is the CompList object that is undefined and causing this error. Wondering why this is being undefined at this point within IE but working within Chrome and Edge or at least not throwing the error.
for (var i = 0; i < CompList.length; i++) {
function CreatePopulateDataSet() {
//*************************************************************************
//Company/Division/SubCat/Plan dataset populate - BEGIN********************
//*************************************************************************
var g_CompanyList = {};
var g_DivisionList = {};
var g_SubCatList = {};
try {
if ($("#selCompanyList").find("option").length > 0) {
try {
$("#selCompanyList option").each(function () {
var Comp = $(this).text().split("|")[0];
var Div = $(this).text().split("|")[1];
var SubCat = $(this).text().split("|")[2];
var Plant = $(this).text().split("|")[3];
var CompList = g_CompanyList[Comp];
var DivList = g_DivisionList[Comp + Div];
var SubList = g_SubCatList[Comp + Div + SubCat];
try {
if (hasCompanyAccess(Comp)) {
if (!CompList) { CompList = new Array(); }
if ($.inArray(Div, CompList) == -1) {
CompList.push(Div);
g_CompanyList[Comp] = CompList;
}
if (!DivList) { DivList = new Array(); }
if (SubCat != null) {
if ($.inArray(SubCat, DivList) == -1) {
DivList.push(SubCat);
g_DivisionList[Comp + Div] = DivList;
}
}
if (!SubList) { SubList = new Array(); }
if (Plant != null) {
if ($.inArray(Plant, SubList) == -1) {
SubList.push(Plant);
g_SubCatList[Comp + Div + SubCat] = SubList;
}
}
}
}
catch (err) {
alert("Unable build global lists used to populate drop downs. " + err);
}
});
}
catch (err) {
alert(err);
}
$("#selPARCompany").html("<option value=''>Please Select...</option>");
for (var Comp in g_CompanyList) {
$("#selPARCompany").append("<option value='" + Comp + "'>" + Comp + "</option>");
}
$("#selPARCompany").addClass("fullwidth");
//Cascade Reload - BEGIN
//Re-loads/populates the cascading data set if the form has been submitted.
if ($("#OBPropertyItemNum").val()) {
//re-sets the Company drop down box on load of a submitted form.
var tempComp = $("#txtPARCompany").val();
$("#selPARCompany option").each(function () {
if ($(this).text().toUpperCase() == tempComp.toUpperCase()) {
$(this).attr("selected", "selected");
}
});
//Calls the CompanyTabOverride method to set access to the corrct tabs based on the saved value.
CompanyTabOverride(tempComp);
var CompList = g_CompanyList[$("#selPARCompany option:selected").text().toUpperCase()];
var tempDiv = $("#txtPARDivision").val();
//re-load and populate the Division drop down box
for (var i = 0; i < CompList.length; i++) {
if (i == 0)
$("#selPARDivision").html("<option value=''>Please Select...</option>");
if (CompList[i].toUpperCase() == tempDiv.toUpperCase()) {
$("#selPARDivision").append("<option selected=selected label='" + CompList[i] + "' value='" + CompList[i] + "'>" + tempComp + CompList[i] + "</option>");
} else {
$("#selPARDivision").append("<option label='" + CompList[i] + "' value='" + CompList[i] + "'>" + tempComp + CompList[i] + "</option>");
}
}
if ($("#selPARDivision option").length > 1) {
$("#selPARDivision").closest("td").show();
$("#selPARDivision").addClass("required");
} else {
$("#selPARDivision").closest("td").hide();
$("#selPARDivision").removeClass("required");
$("#selPARDivision").removeClass("requiredInput");
}
DivisionTabOverride(tempComp, tempDiv);
//re-load and populate the Sub Category drop down box
var tempSubCat = $("#txtPARSubCat").val();
var DivList = g_DivisionList[$("#selPARDivision option:selected").text().toUpperCase()];
var Div = $("#selPARDivision option:selected").html();
if (tempSubCat != "") {
for (var i = 0; i < DivList.length; i++) {
if (i == 0)
$("#selPARSubCat").html("<option value=''>Please Select...</option>");
if (DivList[i].toUpperCase() == tempSubCat.toUpperCase()) {
$("#selPARSubCat").append("<option selected=selected label='" + DivList[i] + "' value='" + DivList[i] + "'>" + Div + DivList[i] + "</option>");
} else {
$("#selPARSubCat").append("<option label='" + DivList[i] + "' value='" + DivList[i] + "'>" + Div + DivList[i] + "</option>");
}
}
if ($("#selPARSubCat option").length > 1) {
$("#selPARSubCat").closest("td").show();
$("#selPARSubCat").addClass("required");
} else {
$("#selPARSubCat").closest("td").hide();
$("#selPARSubCat").removeClass("required");
$("#selPARSubCat").removeClass("requiredInput");
}
}
//re-load and populate the Plant drop down box.
var tempPlant = $("#txtPARPlant").val();
var SubList = g_SubCatList[$("#selPARSubCat option:selected").text().toUpperCase()];
var SubCat = $("#selPARSubCat option:selected").html();
if (tempPlant != "") {
for (var i = 0; i < SubList.length; i++) {
if (i == 0)
$("#selPARPlant").html("<option value=''>Please Select...</option>");
if (SubList[i].toUpperCase() == tempPlant.toUpperCase()) {
$("#selPARPlant").append("<option selected=selected label='" + SubList[i] + "' value='" + SubList[i] + "'>" + SubCat + SubList[i] + "</option>");
} else {
$("#selPARPlant").append("<option label='" + SubList[i] + "' value='" + SubList[i] + "'>" + SubCat + SubList[i] + "</option>");
}
}
if ($("#selPARPlant option").length > 1) {
$("#selPARPlant").closest("td").show();
$("#selPARPlant").addClass("required");
} else {
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
}
}
}
//Cascade Reload - END
try {
$("#selPARCompany").bind("change", function () {
var Comp = $(this).val();
$("#selPARDivision").html("<option value=''>Please Select...</option>");
$("#txtPARDivision").val("");
$("#selPARSubCat").html("<option value=''>Please Select...</option>");
$("#txtPARSubCat").val("");
$("#selPARPlant").html("<option value=''>Please Select...</option>");
$("#txtPARPlant").val("");
if ($(this)[0].selectedIndex > 0) {
var CompList = g_CompanyList[Comp];
for (var i = 0; i < CompList.length; i++) {
//$("#selPARDivision").append("<option value='" + Comp + CompList[i] + "'>" + CompList[i] + "</option>");
$("#selPARDivision").append("<option label='" + CompList[i] + "' value='" + CompList[i] + "'>" + Comp + CompList[i] + "</option>");
}
}
$("#selPARDivision").addClass("fullwidth");
$("#txtPARCompany").val($("#selPARCompany").val());
if ($("#selPARDivision option").length > 1) {
$("#selPARDivision").closest("td").show();
$("#selPARDivision").addClass("required");
$("#selPARSubCat").closest("td").hide();
$("#selPARSubCat").removeClass("required");
$("#selPARSubCat").removeClass("requiredInput");
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
} else {
$("#selPARDivision").closest("td").hide();
$("#selPARDivision").removeClass("required");
$("#selPARDivision").removeClass("requiredInput");
$("#selPARSubCat").closest("td").hide();
$("#selPARSubCat").removeClass("required");
$("#selPARSubCat").removeClass("requiredInput");
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
}
CompanyTabOverride(Comp);
IsEngineeringLevelRequired(Comp);
IsUniqPlanIDRequired(Comp, $('#selPARExpenditureinBusinessPlan').find(":selected").text());
//$('#selPARExpenditureinBusinessPlan').change();
});
$("#selPARDivision").bind("change", function () {
var Div = $("#" + $(this).attr("id") + " option:selected").html();
$("#selPARSubCat").html("<option value=''>Please Select...</option>");
$("#txtPARSubCat").val("");
$("#selPARPlant").html("<option value=''>Please Select...</option>");
$("#txtPARPlant").val("");
if ($(this)[0].selectedIndex > 0) {
var DivList = g_DivisionList[Div];
if (DivList) {
for (var i = 0; i < DivList.length; i++) {
//$("#selPARSubCat").append("<option value='" + Div + DivList[i] + "'>" + DivList[i] + "</option>");
$("#selPARSubCat").append("<option label='" + DivList[i] + "' value='" + DivList[i] + "'>" + Div + DivList[i] + "</option>");
}
}
}
$("#selPARSubCat").addClass("fullwidth");
$("#txtPARDivision").val($("#selPARDivision").val());
if ($("#selPARSubCat option").length > 1) {
$("#selPARSubCat").closest("td").show();
$("#selPARSubCat").addClass("required");
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
} else {
$("#selPARSubCat").closest("td").hide();
$("#selPARSubCat").removeClass("required");
$("#selPARSubCat").removeClass("requiredInput");
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
}
DivisionTabOverride($("#selPARCompany").val(), $(this).val());
});
$("#selPARSubCat").bind("change", function () {
//var SubCat = $(this).val();
var SubCat = $("#" + $(this).attr("id") + " option:selected").html();
$("#selPARPlant").html("<option value=''>Please Select...</option>");
$("#txtPARPlant").val("");
if ($(this)[0].selectedIndex > 0) {
var SubList = g_SubCatList[SubCat];
if (SubList) {
for (var i = 0; i < SubList.length; i++) {
//$("#selPARPlant").append("<option value='" + SubCat + SubList[i] + "'>" + SubList[i] + "</option>");
$("#selPARPlant").append("<option label='" + SubList[i] + "' value='" + SubList[i] + "'>" + SubCat + SubList[i] + "</option>");
}
}
}
$("#selPARPlant").addClass("fullwidth");
$("#txtPARSubCat").val($("#selPARSubCat").val());
if ($("#selPARPlant option").length > 1) {
$("#selPARPlant").closest("td").show();
$("#selPARPlant").addClass("required");
} else {
$("#selPARPlant").closest("td").hide();
$("#selPARPlant").removeClass("required");
$("#selPARPlant").removeClass("requiredInput");
}
});
$("#selPARPlant").bind("change", function () {
$("#txtPARPlant").val($("#selPARPlant").val());
});
}
catch (err) {
alert("loadForm: if GroupDocList>0: bind Group Change:" + err);
}
}
}
catch (err) {
alert("loadForm: if GroupDocList>0: " + err);
}

variable being reset in a 'for loop'

I am pushing info from a database to a calendar, where each date has an id equal to an id in the database. The code iterates through the database searching for matching pairs. If a match is found, the name of the image is to be placed into image tags in the calendar. However, the default image is the only one showing, and the variable calImg is seemingly being reset to default. var idCalendar = [];
var arrayCalendar = -1;
var calImg; are global variables
while (counter <= numOfDays) {
var dateID = counter + monthIDName;
idCalendar[counter - 1] = dateID;
//alert(idCalendar[counter-1]);
// When to start new line.
if (weekdays2 > 6) {
weekdays2 = 0;
htmlContent += "</tr><tr>";
}
//check to ensure the mydb object has been created
/////////////////////////////////////////////////////////////////////////////
if (mydb) {
//Get all the entry from the database with a select statement
mydb.transaction(function(t) {
t.executeSql("SELECT rating FROM entry WHERE calendar=?", [idCalendar[arrayCalendar + 1]], function(t, results) {
var i;
//Iterate through the results
if (results.rows.length != 0) {
for (i = 0; i < results.rows.length; i++) {
var row = results.rows.item(i);
calImg = row.rating;
alert(idCalendar[arrayCalendar] + calImg);
}
} else {
alert(idCalendar[arrayCalendar]);
calImg = 'default';
}
});
arrayCalendar++;
});
} else {
myApp.alert("query error");
}
////////////////////////////////////////////////////////////////////////////////////////////////////
// if counter is current day.
// highlight current day using the CSS defined in header.
if (counter == day && month == curMonth && year == curYear) {
htmlContent += "<td class='dayNow' id='" + counter + monthIDName + "' onMouseOver='this.style.background=\"#FF0000\"; this.style.color=\"#FFFFFF\"' " + "onMouseOut='this.style.background=\"#FFFFFF\"; this.style.color=\"#FF0000\"'>" + counter + "<img src= 'img/" + calImg + ".png' align='left' height= '15' width= '15'>" + "<br>" + "</td>";
} else {
htmlContent += "<td class='monthNow' id='" + counter + monthIDName + "' onMouseOver='this.style.background=\"#FF0000\"'" + " onMouseOut='this.style.background=\"#FFFFFF\"'>" + counter + "<img src= 'img/" + calImg + ".png' align='left' height= '15' width= '15'>" + "<br>" + "</td>";
}
weekdays2++;
counter++;
}

Pushing to null array, even though it is called as a global and works in my localhost, but not on the server

I'm getting the following error in my javascript. As the title states, this code is working on my localhost, but not when I put it onto my server
Uncaught TypeError: Cannot read property 'push' of null
at addItemToCart (shoppingCart.js:36)
at HTMLButtonElement.<anonymous> (shoppingCart.js:193)
at HTMLDocument.dispatch (jquery-1.11.1.min.js:3)
at HTMLDocument.r.handle (jquery-1.11.1.min.js:3)
I have identified that just before this push function is called that the cart variable is indeed null, but I declare it globally as an empty array, so I'm not sure why that would be.
Code for the function its failing on
var cart = [];
function addItemToCart(name, price, count, id, shortName) {
for (var i in cart) {
if (cart[i].id === id) {
cart[i].count += count;
saveCart();
for (var i in cart) {
if (cart[i].id == 500 && id != 500) {
removeItemFromCart(500);
alert('because you changed your cart, you will have to reapply your coupon');
}
}
return;
}
}
for (var i in cart) {
if (cart[i].id == 500 && id != 500) {
removeItemFromCart(500);
alert('because you changed your cart, you will have to reapply your coupon');
}
}
var item = new Item(name, price, count, id, shortName);
console.log(cart);
cart.push(item);
saveCart();
}
The error happens at teh cart.push(item); line because cart is null and can not be pushed to. Anymore information someone may need to help feel free and I will shoot it your way.
Thanks in advance!!!
edit:
function displayCart() {
console.log("*** display Cart ***");
var cartArray = listCart();
var output = "<tr><th>Items</th><th>Quantity</th><th>Price</th></tr>";
var output2 = "<tr><th> </th><th>Product name</th><th>Product price</th><th>Quantity</th><th>Total</th></tr>";
var output3 = " <tr><th>Product(s)</th></tr>";
var output4 = "";
console.log(listCart());
for (var i in cartArray) {
output += "<tr class='item'><td><div class='delete' id='removeItem' data-id='" + cartArray[i].id + "'></div>" + cartArray[i].name + "</td><td><input type='text' value='" + cartArray[i].count + "' readonly></td> <td class='price'>" + cartArray[i].price + "</td></tr>"
output2 += "<tr class='item'>"
+ "<td class='thumb'><a href='" + cartArray[i].id + "-item.php'><img src='img/catalog/product-gallery/" + cartArray[i].id + ".png' alt='Product Image'/></a></td>"
+ "<td class='name'><a href='" + cartArray[i].id + "'-item.php'>" + cartArray[i].name + "</a></td>"
+ "<td class='price'>$" + cartArray[i].price + "</td>"
+ "<td class='qnt-count'>"
+ "<a class='incr-btn' href='#' id='oneless' data-id='" + cartArray[i].id + "'>-</a>"
+ "<input class='quantity form-control' type='text' value=' " + cartArray[i].count + " '>"
+ "<a class='incr-btn' id='onemore' data-productid='" + cartArray[i].id + "' data-name='" + cartArray[i].name + "' data-quantity='" + cartArray[i].count + "' href='#'>+</a>"
+ "</td>"
+ "<td class='total'>$<em id='test'>" + cartArray[i].total + "</em></td>"
+ "<td class='delete' id='removeAllFromCart' data-id='" + cartArray[i].id + "'><i class='icon-delete'></i></td>"
+ "</tr>";
output3 += " <tr><td class='name border'>" + cartArray[i].shortName + "<span>x" + cartArray[i].count + "</span></td>"
+ "<td class='price border'>$" + cartArray[i].total + "</td></tr>";
if ($("#offerCount").attr("data-id") == cartArray[i].id) {
output4 += +"<a class='incr-btn' href='#' id='oneless' data-id='" + cartArray[i].id + "'>-</a>"
+ "<input class='quantity form-control' type='text' value=' " + cartArray[i].count + " '>"
+ "<a class='incr-btn' id='onemore' data-productid='" + cartArray[i].id + "' data-name='" + cartArray[i].name + "' data-quantity='" + cartArray[i].count + "' href='#'>+</a>";
}
}
output3 += " <tr><td class='th border'>Shipping</td><td class='align-r border'>Free shipping</td></tr>"
+ "<tr><td class='th'>Order total</td><td class='price'>$" + totalCart() + "</td></tr>"
$("#offerCount").html(output4);
$("#productDisplay").html(output3);
$("#showFullCart").html(output2);
$("#showCart").html(output);
$("#cartTotal").html(totalCart());
$("#totalCart").html(totalCart());
$("#myCartTotal").html(totalCart());
$("#showmyTotal").html(totalCart());
$("#cartCount").html(countCart());
}
function addCouponToCart(coupon) {
if (coupon == 'coupon10' && couponsAdded == 0) {
var couponReduce = -(totalCart() * .1).toFixed(2);
addItemToCart('10% off Coupon', couponReduce, 1, 500, '10% off');
couponsAdded += 1;
saveCoupon();
}
displayCart();
}
function countCart() {
var totalCount = 0;
for (var i in cart) {
totalCount += cart[i].count;
}
return totalCount;
}
function removeItemFromCartAll(id) {
for (var i in cart) {
if (cart[i].id === id) {
cart.splice(i, 1);
break;
}
}
for (var i in cart) {
if (cart[i].id == 500 && id != 500) {
removeItemFromCart(500);
alert('because you changed your cart, you will have to reapply your coupon');
}
}
saveCart();
}
Code that calls the addCouponToCart Function whenever a post gets set.
<?php if (isset($_POST['coupon_code'])) { ?>
<script>
addCouponToCart(coupon);
</script>
<?php } ?>

#codenoname Provided the correct answer of checking for the null cart. That solved the issue, ultimately a lot of functions were not being defined properly. I had wrapped the entire code in a document ready function which seemed to be the issue. Whenever I removed that it worked. Thank you all for your input.
if (!cart) {
cart = [];
}

how to find the divs specific Nth siblings of child divs positions

i create new hours calendar. as per the IMAGE1 when user click on any of div that dynamic Span was created up to 8 hours.
i.e. if click on 00:00 its design up to 08:00 hours
so my question is how to get that specific siblings 8th divs child position.
Or any other way please suggest me.
$(this).eq(+8).attr("id");
IMAGE1
Table Design Code when ajax return Success:
$(r.emp_nm).each(function (index) {
tabelBody += "<tr><td style='width:10%'><div class='col-xs-3 col-md-3 on-break-tab'>" + this.fname.charAt(0) + this.lname.charAt(0) + "</div>" + this.fname + ' ' + this.lname + " </td>";
for (var i = 0; i < 24; i++) {
var tabelsubBody = "";
var p = 15;
var t_id = r.hours[i];
for (var j = 0; j < 4; j++) {
tabelsubBody += "<div style='float:left; width:25%;height:inherit;' class='Dropablesub_td' data-employeID='" + this.id + "' data-date='" + t_id + "' id='" + t_id + "_" + this.id + "_" + j + "'></div>";
}
if (i === 23) {
tabelBody += "<td style='width:12.5%' class='Dropabletd' data-employeID='" + this.id + "' data-date='" + t_id + "' id='" + t_id + "_" + this.id + "'>" + tabelsubBody + "</td></tr>";
} else {
tabelBody += "<td style='width:12.5%' class='Dropabletd' data-employeID='" + this.id + "' data-date='" + t_id + "' id='" + t_id + "_" + this.id + "'>" + tabelsubBody + "</td>";
}
}
});
$("#tabelBody").html(tabelBody);
$("#tdDate").html(r.today);
$("#SelectDate").val(r.today);
$("#currentSelect").val("Days");
Events();
And Events() is :
function Events() {
$("body").on("click", ".Dropablesub_td", function () {
var hidid = $(this).attr("id");
var Myleft = $(this).position().left;
var Mytop = $(this).position().top;
alert($(this).eq(+8).attr("id"));
$(this).append("<span id='" + hidid + "' class='divId label label-success ui-widget-content filediv unselectable' >ABCDEFGHIJKLMNOPQRSTUVWXYZ<span>");
$(this).children(
).css({zIndex: 999, position: "absolute", top: Mytop, left: Myleft, width: '40%', display: "block", border: "#808080 solid 2px", color: "black", background: "#00CEB4"});
});
}

You can get the desired element using .index() of current element and then using .eq() to target the next element.
Here in the snippet I have created a pseudo code for demonstration
$(document).on("click", ".dropabletd", function() {
var tr = $(this).closest('tr');
var tds = tr.find('td');
var index = tds.index(this);
var sibling = tds.eq(index + 8);
console.log($(this).attr('id'), sibling.attr('id'));
});
createTable();
function createTable() {
var tabelBody = ""
for (var i = 0; i <= 23; i++) {
tabelBody += "<td class='dropabletd' id='id" + i + "'>" + i + "</td>";
}
$("table tr").html(tabelBody);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr></tr>
</table>

javascript html tag not adding content

I am attempting to append content to a div as a table
<div id="viewcontent"></div>
<script>
$('#viewcontent').html = $('#viewcontent').html + "<table bgcolor='#CCCCFF' bordercolor='#000000' align='center' width='600' border='1'>";
for (var i = 1, len = msg.length; i < len; i=i+6) {
if (msg[i+1] == 1) { //misc
var rtype = "Miscellaneous"
var rcolor = "#CCCCFF"
} else if (msg[i+1] == 2) { //verbal
var rtype = "Verbal"
var rcolor = "#FFF000"
} else if (msg[i+1] == 3) { //written
var rtype = "Written"
var rcolor = "#FFAA00"
} else if (msg[i+1] == 4) { //Critical
var rtype = "Critical"
var rcolor = "#FF0000"
} else if (msg[i+1] == 5) { //Positive
var rtype = "Positive"
var rcolor = "#55FF22"
} else if (msg[i+1] == 6) { //Performance Review
var rtype = "Performance Review"
var rcolor = "#C8C8C8"
}
$('#viewcontent').html = $('#viewcontent').html + "<tr><td colspan='1' align='center' border='1' width='5%'><input type='radio' name='RID' value='" + msg[i+5] + "'></td><td class='file' colspan='1' align='center' border='1' width='20%' bgcolor='" + rcolor + "'><a href='upload_files/" + emp + "/" + msg[i+2] + "'>" + rtype + "</a></td><td colspan='1' align='center' border='1' width='15%'>" + msg[i] + "</td><td colspan='1' align='center' border='1' width='20%'>" + msg[i+4] + "</td><td colspan='1' align='center' border='1' width='40%'>" + msg[i+3] + "</td></tr>";
}
$('#viewcontent').html = $('#viewcontent').html + "</table>";
</script>
This is resulting in an empty Div - content is being sent when using innerhtml I am receiving the content Without any tags
How do I append to this content without deleting and maintaining my html

The jQuery .html property is a function:
$("something").html("some content");
Similarly, when you want to get the content:
var theContents = $("something").html();

Try the following
<div id="viewcontent"></div>
<script>
$('#viewcontent').html('');
$('#viewcontent').append("<table bgcolor='#CCCCFF' bordercolor='#000000' align='center' width='600' border='1'>");
for (var i = 1, len = msg.length; i < len; i=i+6) {
if (msg[i+1] == 1) { //misc
var rtype = "Miscellaneous"
var rcolor = "#CCCCFF"
} else if (msg[i+1] == 2) { //verbal
var rtype = "Verbal"
var rcolor = "#FFF000"
} else if (msg[i+1] == 3) { //written
var rtype = "Written"
var rcolor = "#FFAA00"
} else if (msg[i+1] == 4) { //Critical
var rtype = "Critical"
var rcolor = "#FF0000"
} else if (msg[i+1] == 5) { //Positive
var rtype = "Positive"
var rcolor = "#55FF22"
} else if (msg[i+1] == 6) { //Performance Review
var rtype = "Performance Review"
var rcolor = "#C8C8C8"
}
$('#viewcontent').append("<tr><td colspan='1' align='center' border='1' width='5%'><input type='radio' name='RID' value='" + msg[i+5] + "'></td><td class='file' colspan='1' align='center' border='1' width='20%' bgcolor='" + rcolor + "'><a href='upload_files/" + emp + "/" + msg[i+2] + "'>" + rtype + "</a></td><td colspan='1' align='center' border='1' width='15%'>" + msg[i] + "</td><td colspan='1' align='center' border='1' width='20%'>" + msg[i+4] + "</td><td colspan='1' align='center' border='1' width='40%'>" + msg[i+3] + "</td></tr>");
}
$('#viewcontent').append("</table>");
</script>
Hope, this would help!