How to access specific object in an array of DOM objects in jQuery?
<p>Ok so I wanna ask a simple jQuery question about arrays of objects. </p>

<p>If I get all elements (for example all paragraphs) from an html page and store them in an array how can I access one of them to do stuff with it?</p>

<p>For example let's say I have this html:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;&lt;/title&gt; 
    &lt;/head&gt;
    &lt;body&gt; 
    &lt;p&gt;Paragraph 1&lt;/p&gt;
    &lt;p&gt;Paragraph 2&lt;/p&gt;
    &lt;p&gt;Paragraph 3&lt;/p&gt;
    &lt;button id="myButton"&gt;Click here&lt;/button&gt;

    &lt;script src="jquery-1.6.2.min.js"&gt;&lt;/script&gt;
    &lt;script src="script.js"&gt;&lt;/script&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>This is my script.js:</p>

<pre><code>$(document).ready(function(){
    $("#myButton").click(function(){

        var $paragraphs = $("p"); 
        $paragraphs.detach();  //Works fine, removes all elements
        //$paragraphs[0].detach();  //Doesn't work!

    }); 
});
</code></pre>

<p>I'm trying to call detach on the first element of the array, so that I can remove the first paragraph but it doesn't seem to work...</p>

<p>Is there any way to access the first paragraph without using id attributes?</p>
