How to iterate over json elements?

Question

JavaScript

There is an object from which you need to take the value of the name property and write it to the tag. I have a ready-made html markup in which I need to insert the value of the name property.

it needs to be like this:

<li class="block_1"><h1>boock_1 </h1>   </li>
<li class="block_2"><h1>boock_2 </h1>   </li>
<li class="block_3"><h1>boock_3 </h1>   </li>

Here is the object

var json_date = {
   "dills": {
     "1": {
       "name": "boock_1",
       "time": "15:00",
     },
     "2": {
       "name": "book_2",
       "time": "15:00",
     },
     "3": {
       "name": "book_3",
       "time": "09:00",

     },
     "4": {
       "name": "book_4",
       "time": "05:00",
     }
   }
 }

I've tried like this:

$("li > h1").each(function(i) {
  $(this).html(val.name + " ");
});

But returns only the last name value in all h1 tags

Answer 1

Why not do it like this?
https://jsfiddle.net/sxzk9ooa/1/