title: ReferenceError: "function" is not defined
body: <p>I am getting the error "ReferenceError: AddtoCart is not defined" on my shopping basket add to cart code.  The button is executed on an onlick.  My Javascript is:</p>
  
  <pre class="lang-js prettyprint-override"><code>        &lt;script type="text/javascript"&gt;
           var basket = [];
  
  // display basket and fill cells
  function displaybasket() {
      var shoppingBasketTblBody = document.getElementById("shoppingBasketTblBody");
      while (shoppingBasketTblBody.rows.length &gt; 0) {
          shoppingBasketTblBody.deleteRow(0);
      }
  
      var basket_total = 0.00;
  
      //populating the table
  
      for (var product in basket) {
          var removeButton = document.createElement('input');
          removeButton.type = 'button';
          removeButton.value = 'X';
          removeButton.onclick = removeItem;
          /* could not work out how to implement without using cookies, ran out of time.
          var addButton = document.createElement('input');
          addButton.type = 'button'; 
          addButton.value = '+';
          addButton.onclick = 'addItem';
          var minusButton = document.createElement('input');
          minusButton.type = 'button'; 
          minusButton.value = '-';
          minusButton.onclick = 'minusItem;' */
          var row = shoppingBasketTblBody.insertRow();
          var cellName = row.insertCell(0);
          var cellDescription = row.insertCell(1);
          var cellPrice = row.insertCell(2);
          var cellAmount = row.insertCell(3);
          var cellRemove = row.insertCell(4);
          cellPrice.align = "right";
          cellName.innerHTML = basket[product].Name;
          cellDescription.innerHTML = basket[product].Description;
          cellPrice.innerHTML = "£" + basket[product].Price.toFixed(2);
          cellAmount.innerHTML = basket[product].Quantity;
          cellRemove.appendChild(removeButton);
          basket_total += parseFloat(basket[product].Price);
          console.log(basket_total);
      }
      // display total cost
      document.getElementById("cart_total").innerHTML = "£" + basket_total.toFixed(2);
  }
  
  
  function AddtoCart(name, Description, price, Quantity) {
      //create product
      var item = {};
      item.Name = name;
      item.Description = Description;
      item.Price = parseFloat(price);
      item.Quantity = Quantity;
      //push to basket
      basket.push(item);
      //call display basket function
      displaybasket();
  }
  
  function removeAll() {
      basket.length = 0.0;
      basket_total = 0.00;
      document.getElementById("shoppingBasketTblBody").deleteRow();
  }
  
  function removeItem(i) {
      foodList.splice(i, 1); // remove element at position i
      var newFood = "";
      for (var i = 0; i &amp; lt; foodList.length; i++) {
          newFood += "&lt;a href='#' onClick='removeRecord(" + i + ");'&gt;X&lt;/a&gt; " + foodList[i] + " &lt;br&gt;";
      };
      document.getElementById('foods').innerHTML = newFood;
  }
  
  /*could not work out how to implement without using cookies, ran out of time.
  function addItem() {
  
  }   
  
  function minusItem() {
  
  }*/
  </code></pre>
  
  <p></p>
  
  <p>The button code is:</p>
  
  <pre><code> &lt;button type="button" onclick="AddtoCart('{Product}','{Description}','{price}','1')"&gt;Add one to cart&lt;/button&gt;
  </code></pre>
  
  <p>Product, Description, price are passed from XML.</p>