Skip to content

Instantly share code, notes, and snippets.

@OfTheDelmer

OfTheDelmer/jsbin.fafise.html

Created July 17, 2014 08:21
Show Gist options
  • Save OfTheDelmer/753f9c716a26e5ca3b7d to your computer and use it in GitHub Desktop.
Save OfTheDelmer/753f9c716a26e5ca3b7d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
jsbin.fafise.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Food Tracker</title>
</head>
<body>
<form id="new_food_item">
<div>
<input type="text" name="food[name]" placeholder="Name">
</div>
<div>
<select name="food[group]">
<option value="dairy">Dairy</option>
<option value="fruits">Fruits</option>
<option value="grains">Grains</option>
<option value="oils">Oils</option>
<option value="protiens">Protiens</option>
<option value="vegetables">Vegatables</option>
</select>
</div>
<button>Save Food</button>
</form>
<div class="food-groups">
<div class="food-group" id="dairy">
</div>
<div class="food-group" id="fruits">
</div>
<div class="food-group" id="grains">
</div>
<div class="food-group" id="oils">
</div>
<div class="food-group" id="protiens">
</div>
<div class="food-group" id="vegetables">
</div>
</div>
</body>
</html>
Raw
jsbin.fafise.js
var DOMHelper = {
select: function(selector) {
return document.querySelector(selector);
},
selectAll: function(selector) {
return document.querySelectorAll(selector);
},
append: function(selector, element){
this.select(selector).appendChild(element);
},
remove: function(element){
element.parentNode.removeChild(element);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment