I am using creating custom html from a list service. When trying to add the data to a div inner html I receive an error that says cannot read property of null.
This is what is in HTML component. I have a service that pass data to two functions inside the HTML component.
What am I doing wrong??
<!--
<div id="riceContainer" class="content"
<div id="riceLeft" class="leftColumn" <
<div id="riceRight" class="rightColumn" <
<
<script type="text/javascript"
function leftColumn(data){
console.log("Left: "+data.Name);
Code: Select all
var el = document.getElementById("riceLeft");
console.log(el);
el.innerHTML += '<div class="card"';
el.innerHTML += '<div class="card-image"';
el.innerHTML += '<h2'+data.Name+'</h2';
el.innerHTML += '<p';
el.innerHTML += data.Description;
el.innerHTML += '</p';
el.innerHTML += '<';
el.innerHTML += '<';
}
function rightColumn(data){
console.log("Right: "+data.Name);
var el = document.getElementById("riceRight");
el.innerHTML += '<div class="card"';
el.innerHTML += '<div class="card-image"';
el.innerHTML += '<h2'+data.Name+'</h2';
el.innerHTML += '<p';
el.innerHTML += data.Description;
el.innerHTML += '</p';
el.innerHTML += '<';
el.innerHTML += '<';
}
</script
--