Uncaught reference error with cookies [javascript] -

i'm having trouble plugging in text field create cookie. there appears reference error can't figure out why. seems simplified version compared w3c still won't work. know why?

    <div id='sandbox'>      </div>      username: <input type='text' id='form'><br>     <button onclick="createcookie">create cookie</button>     <button onclick="displaycookie">display cookie</button>  <script> var username = document.getelementbyid('form').value  function createcookie(username) { document.cookie = "user" + "=" + username; }  function displaycookie() { document.getelementbyid('sandbox').innerhtml = document.cookie; } </script> 

there several issues here, let's break down

---

<node onclick="foo" /> 

can thought of similar to

node.click = function () {     foo }; 

notice how foo not invoked here. either need use () or attach differently.

---

var bar = document.getelementbyid('form').value; 

will node id form it's value property , take copy , call bar. never change again until bar = ...

---

function fizz(bar) {     return bar; } fizz(); 

although bar may have been defined before function, parameter named bar hides within fizz, , therefore bar inside fizz can passed first parameter, not bar higher scope.

---

var buzz = document.cookie; 

document.cookie not simple property might expect, when try get it, you'll given every cookie.