title: Using querySelectorAll to target nested elements
body: <p>How do I use <code>querySelectorAll</code> to select <code>&lt;p&gt;</code> with parent <code>&lt;div class="entry-content"&gt;</code> only?</p>
  
  <p>Eg.</p>
  
  <pre><code>&lt;div&gt;
      &lt;p&gt;ParagraphA&lt;/p&gt;
      &lt;p&gt;ParagraphB&lt;/p&gt;
  &lt;/div&gt;
  &lt;div class="entry-content"&gt;
      &lt;p&gt;Paragraph1&lt;/p&gt;
      &lt;p&gt;Paragraph2&lt;/p&gt;
      &lt;p&gt;Paragraph3&lt;/p&gt;
  &lt;/div&gt;
      &lt;p&gt;Paragraph4&lt;/p&gt;
      &lt;p&gt;Paragraph5&lt;/p&gt;
  </code></pre>
  
  <p>I only want <em>Paragraph1 ~ Paragraph3</em> to be selected.</p>
  
  <p>I'm currently using <code>var x = document.querySelectorAll("p");</code> which is selecting everything.</p>
  
  <p><code>var x = document.querySelectorAll("div &gt; p");</code> is very closed to getting what I need, but I need to ensure only selecting all <code>&lt;p&gt;</code> elements within the <code>&lt;div class="entry-content"&gt;</code> with class specified.</p>
  
  <p>How can this be modified to accomplish the task?</p>