JavaScript createElement with ID
<p>I am creating a JavaScript array with 3 elements:</p>

<pre><code>var employees =
    [
        {"firstName":"John", "lastName":"Doe"},
        {"firstName":"Anna", "lastName":"Smith"},
        {"firstName":"Peter", "lastName":"Jones"}
    ]
</code></pre>

<p>I want to use a <code>for</code> loop to loop through the data. Here is the for loop:</p>

<pre><code>for (int i = 0; i &lt; employees.length; i++)
</code></pre>

<p>I want to create a new <code>&lt;p&gt;</code> for each object and place the data in the new <code>&lt;p&gt;</code>. I believe that I need to assign an id to each <code>&lt;p&gt;</code>. How would I achieve this?</p>

<p>Complete code thus far:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;body&gt;
        &lt;h2&gt;JSON Java Syntax Examples&lt;/h2&gt;
&lt;!--        &lt;p id="demo"&gt;&lt;/p&gt;--&gt;

        &lt;script&gt;
            var employees =
                [
                    {"firstName":"John", "lastName":"Doe"},
                    {"firstName":"Anna", "lastName":"Smith"},
                    {"firstName":"Peter", "lastName":"Jones"}
                ]

            for (int i = 0; i &lt; employees.length; i++)
                {
                    document.createElement("p");
                    document.getElementById(i).innerHTML = employees[i].firstName + " " + employees[i].lastName;
                }
//            document.getElementById("demo").innerHTML = employees[0].firstName + " " + employees[0].lastName;
        &lt;/script&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>