Dynamically created elements - How to make proper selector and access top objects
<blockquote>
  <p><strong>Possible Duplicate:</strong><br>
  <a href="http://stackoverflow.com/questions/1266604/jquery-selection-within-a-selection">Jquery: Selection within a selection</a>  </p>
</blockquote>



<p>Consider this code:</p>

<pre><code>var $el = $('&lt;div class="test"&gt;&lt;div&gt;Foor&lt;/div&gt;&lt;/div&gt;&lt;div class="test"&gt;&lt;div&gt;Bar&lt;/div&gt;&lt;/div&gt;&lt;div class="other"&gt;Leave it!&lt;/div&gt;');

// won't work
$el.find('div.test').css('color','red');

$('body').append($el);
</code></pre>

<p>jsFiddle:</p>

<ul>
<li><a href="http://jsfiddle.net/bVJkR/2/" rel="nofollow">http://jsfiddle.net/bVJkR/2/</a></li>
</ul>

<p>How can I access <code>&lt;div class="test"&gt;</code> elements using jQuery? </p>

<p>Please note I would like to access <code>.test</code> elements before using them in document.</p>

<p>I know I can create wrapper for divs, but I really would like to avoid it.</p>
