previousSibling not working
<p>I want to target the first <code>&lt;p&gt;</code> inside the div by selecting the second <code>&lt;p&gt;</code> and using <code>previousSibling</code> property but it is not working.</p>

<pre><code>&lt;div id="par"&gt;
&lt;p id="p1"&gt;test&lt;/p&gt;
&lt;p id="p2"&gt;test&lt;/p&gt;
&lt;/div&gt;


document.getElementById('p2').previousSibling.className = 'red';
</code></pre>

<p><strong>EDIT:</strong></p>

<p>OK it works on all browsers except IE8 but I want it to work in IE8 as well, I tried the following conditional but to no effect:</p>

<pre><code>var c = document.getElementById('p2').previousElementSibling.className = 'red';

if (c == undefined) {

    c = document.getElementById('p2').previousSibling.className = 'red';
}
</code></pre>

<p>It still works everywhere but IE8. How can I change the above conditional for IE8?</p>

<p><strong>EDIT 2:</strong></p>

<p>Managed to get it to work in IE8 as well:</p>

<pre><code>var c = document.getElementById('p2');

if (c.previousElementSibling) {

    c.previousElementSibling.className = 'red';

} else {

    c.previousSibling.className = 'red';

}
</code></pre>
