Javascript-форум - Как правильно распарсить JSON

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - Как правильно распарсить JSON (https://javascript.ru/forum/events/74030-kak-pravilno-rasparsit-json.html)

Как правильно распарсить JSON

Всем привет!
Задача, на первый взгляд, простая: передать значения из JSON в объекты html.

Вот листинг JSON:

var data = 
	{
		"Moscow": "20",
		"Sydney": "38",
        "Lion": "33",
		"Vienna": "14",
        "Paris": "10"
	}

Листинг html:

Код:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script src="data.json"></script>

</head>

<body> 

     

    <button onmousedown="qwerty()">Button</button>   

    

    <p id="Moscow">1</p>

    <p id="Sydney">1</p>

    <p id="Lion">1</p>

    <p id="Vienna">1</p>

    <p id="Paris">1</p>

    

    <script> 

        

       function qwerty()

        {

        for(x in data)

            console.log(data[x]);

        }

        

    </script>

</body>

</html>

Мне нужно обратиться к каждой строке в JSON, и вытащить из нее названия городов (слева) для запроса по ID, а значения, которые справа, - передать самим объектам. Я пока не силен в JavaScript, и удается вытащить только значения.
Понятно, что можно создать отдельную процедуру для каждого объекта, но у меня их больше сотни, поэтому надо создать правильный цикл. В результате нужно получить вместо единичек в каждом объекте цифры: 20, 38, 33, 14, 10.
Буду рад за любую помощь. Заранее спасибо всем!

console.log у меня стоит просто так, для проверки. Реально я пытался работать в цикле с помощью GetElementByID, и передавать значения через InnerHTML, но что-то никак не получается(((.

Kiten,

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>var data =
    {
        "Moscow": "20",
        "Sydney": "38",
        "Lion": "33",
        "Vienna": "14",
        "Paris": "10"
    }
</script>
</head>
<body>

    <button onmousedown="qwerty()">Button</button>

    <p id="Moscow">1</p>
    <p id="Sydney">1</p>
    <p id="Lion">1</p>
    <p id="Vienna">1</p>
    <p id="Paris">1</p>

    <script>

       function qwerty()
        {
        for(x in data) document.getElementById(x).innerHTML = data[x];
        }

    </script>
</body>
</html>

рони,
Супер!!!!!!!!!!!!!!)))))))))))))))))))))))))) )))))))))))))))))
Спасибо большое!
Всем позитивного настроения!!!!!!!!