I was given a variable and need to put the data into a table. For some reason, when I create the table, instead of inserting each word into a different cell, it is inserting each letter into a different cell. Anyone know what I am doing wrong?

Code:
function writeTable(){
			
				// Variable given
				carData = 'make|model|year|price,honda|civic|2003|4000,toyota|4runner|2006|8000,ford|focus|2001|2999.99,acura|MDX|2010|20000,bmw|325i|2012|23456,ford|taurus|1980|800';
				//Using regular expression to remove the pipes and replace with a space
				carData = carData.replace(/[|]+/g, " ");
				
				//Creates a new array
				var carInfo = new Array();
				// Splits the data into an array
				carInfo = carData.split(",");
				// Creates a table element
				var table = document.createElement('table');
				var tbody = document.createElement('tbody');
				table.style.border = '1px solid black';
				
				var container = document.getElementById('container');
				
				//Loop through the array
				for(i=0; i < carInfo.length; i++){
					
					//Gets the data from from element in array
					var value = carInfo[i];
					// Creates a <tr> element
					var row = document.createElement('tr');
						
					//Looks for odd numbered rows and changes background color
					if((i % 2) != 0){
						row.style.background = '#00BFFF';
					}
					//Loops the data from element in array
					for(var x = 0; x < value.length; x++){
						
						//Creates a <td> element
						var cell = document.createElement('td')
						cell.style.border = '1px solid black';
						
						
						//Adds the text to the cell
						cell.textContent = value[x];
						//Appends <td> to <tr>
						row.appendChild(cell);
					}
					//Appends <tr> to <tbody>
					tbody.appendChild(row);
					
					//document.write("<br />" + carInfo[i]);
				}
				// append <tbody> to <table>
				table.appendChild(tbody);
				// append <table> to div container
				container.appendChild(table);