-2

So I was getting started on Onsen UI and used their sample code on the doc website:

<!doctype html>
<meta charset="utf-8">
<link rel="stylesheet" href="lib/onsen/css/onsenui.css">
<link rel="stylesheet" href="lib/onsen/css/onsen-css-components.css">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1,maximumscale=1, user-scalable=no">
<script src="components/loader.js"></script>
<link rel="stylesheet" href="components/loader.css">
<script>
   ons.bootstrap();
   ons.ready(function() {
   // Add another Onsen UI element
   var content = document.getElementById("#my-content");
   content.innerHTML="<ons-button>Another Button</ons-button>";
   ons.compile(content);
});
</script>
<body>
<ons-navigator title="Navigator" var="myNavigator">
<ons-page>
  <ons-button onclick="myNavigator.pushPage('page2.html')">Next Page</ons-button>
  <div id="my-content"></div>
</ons-page>
</ons-navigator>

</body>

But I got error on "content.innerHTML" saying that content is NULL. I cannot figure out why, any pointer would be apreciated.

Vu Nguyen
  • 1,078
  • 9
  • 11
  • Sorry I was frustrated late last night and didn't know how to ask, it was my first time here.. so I changed the question , hopefully it's simpler and to the point this time! – Vu Nguyen Sep 10 '14 at 15:33
  • Should be var content = document.getElementById("my-content"); – VladL Sep 10 '14 at 16:08
  • That's it. They should fix their document online... this causes confusion for newbies like me! lol Thanks! – Vu Nguyen Sep 10 '14 at 16:51

1 Answers1

1

So this is a simple typing mistake, instead of

var content = document.getElementById("#my-content");

it should be

var content = document.getElementById("my-content");
VladL
  • 12,769
  • 10
  • 63
  • 83