If you must keep your script inline place it at the bottom of your page. See below, you can view the fiddle here
Once the element exists that you need to populate, you then loop the the data you need and fill the related element with your data.
<html>
<body>
<table width="600" border="6" cellpadding="5px">
<tr>
<td> Ram</td>
<td> Storage</td>
</tr>
<tr>
<td id="mac.r"></td>
<td id="mac.s"></td>
</tr>
</table>
<script>
(function() {
var ram = ["8GB", "3GB"];
var storage = ["500GB", "120GB"];
var macR = document.getElementById('mac.r');
var macS = document.getElementById('mac.s');
for(var i = 0; i < ram.length; i++){
if (macR !== null) macR.innerHTML = macR.innerHTML + ram[i] + "<br>";
}
for(var i = 0; i < ram.length; i++){
if (macS !== null) macS.innerHTML = macS.innerHTML + storage[i] + "<br>";
}
})();
</script>
</body>
</html>