JSFiddle - React, Tailwind, and code Playground

by jjperezaguinaga

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.debug.js"></script>
<h2>Brand</h2>
<div data-bind="template: { name: 'filtering-template', data: { arr: filterByBrand } }"></div>

<h2>Area</h2>
<div data-bind="template: { name: 'filtering-template', data: { arr: filterByArea } }"></div>

<script type="text/html" id="filtering-template">
    <p data-bind="text: ko.toJSON($data)"></p>
<ul id="list-dimensions" data-bind="foreach: arr">
    <li>
        <div class="item">ID</div> <span data-bind="text: $data.id"</span>
    </li>
</ul>
</script>

JavaScript

function ProductDimensionsViewModel () {
    var self = this;
    var dimensions = [{"id":"1","type":"AREA","name":"Fine Dining","Description":"blah blah blah","menuItem":"YES"},{"id":"2","type":"TYPE","name":"Type1","Description":"","menuItem":"YES"},{"id":"3","type":"BRAND","name":"Brand 1","Description":"","menuItem":"YES"},{"id":"4","type":"AREA","name":"Hospitality and Events","Description":"","menuItem":"YES"},{"id":"5","type":"AREA","name":"Restaurant","Description":"","menuItem":"YES"},{"id":"6","type":"AREA","name":"Breakfast and Buffet","Description":"","menuItem":"YES"},{"id":"7","type":"AREA","name":"Coffee and Juice Bar","Description":"","menuItem":"YES"},{"id":"8","type":"AREA","name":"Deli and Salad Bar","Description":"","menuItem":"YES"},{"id":"9","type":"AREA","name":"Hot Counter","Description":"","menuItem":"YES"},{"id":"10","type":"AREA","name":"Merchandising and Display","Description":"","menuItem":"YES"},{"id":"11","type":"AREA","name":"Al fresco Dining","Description":"","menuItem":"YES"},{"id":"12","type":"AREA","name":"Trolleys","Description":"","menuItem":"YES"},{"id":"13","type":"AREA","name":"Back of House","Description":"","menuItem":"YES"},{"id":"14","type":"TYPE","name":"Bakeware Sets","Description":"","menuItem":"YES"},{"id":"15","type":"TYPE","name":"Baking Dishes","Description":"","menuItem":"YES"},{"id":"16","type":"TYPE","name":"Cooling Racks","Description":"","menuItem":"YES"},{"id":"17","type":"TYPE","name":"Cookware Sets","Description":"","menuItem":"YES"},{"id":"18","type":"TYPE","name":"Roasters","Description":"","menuItem":"YES"},{"id":"19","type":"TYPE","name":"Bowls","Description":"","menuItem":"YES"},{"id":"20","type":"TYPE","name":"Mugs","Description":"","menuItem":"YES"},{"id":"21","type":"TYPE","name":"Plates","Description":"","menuItem":"YES"},{"id":"22","type":"TYPE","name":"Serveware","Description":"","menuItem":"YES"},{"id":"23","type":"TYPE","name":"Table...