Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
​
<div id="result"></div>
</body>
</html>
 
​
 
var data = {
  "cleaning" : [
    {
      "MOPS" : [
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        }
      ],
​
      "GlOVES" : [
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        }
      ],
​
      "Another Items" : [
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        },
        {
          "id"    : "123",
          "name"  : "best mops",
          "price" : "123"
        }
      ]
    }
  ]
}
​
var result = $('#result');
var obj = data.cleaning[0];
for (var index in obj) {
  var cat = $('<div class="cat"><h2>' + index + '</h2></div>').appendTo(result);
  var items = obj[index];
  for (var i = 0; i < items.length; i++) {
    $('<div>' + items[i].name + '</div>').appendTo(cat);
  }
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
moshfeupro
0viewers