create border around div and his children using wrapAll
<p>My code not workin well.
I want to create border around div id="wrap_all" and his children
using warpAll().
Did Is it possible to use with <code>$("#wrap_all").wrapAll("&lt;div&gt;&lt;/div&gt;");</code>
If yes I don't know how to that.
I am allso don't know how to include <code>id="xxx"</code> inside <code>("&lt;div id="xxx"&gt;&lt;/div&gt;")</code>
order for manipulate the new div with id xxx to make </p>

<pre><code>$(#'xxx')..css("border", "3px double red");
</code></pre>

<p>link for examle:<a href="http://jsfiddle.net/centerwow/9TPtn/27/" rel="nofollow">http://jsfiddle.net/centerwow/9TPtn/27/</a>
Thanks.</p>

<p>code html:</p>

<pre><code>&lt;div  class="foo"&gt;a&lt;/div&gt;
&lt;div class="foo"&gt;b&lt;/div&gt;
&lt;div class="foo"&gt;c&lt;/div&gt;
&lt;div id="foo" class="foo"&gt;d&lt;/div&gt;
 &lt;div id ="wrap_all"&gt;
  &lt;div class="foo"&gt;r&lt;/div&gt;
  &lt;div class="foo"&gt;f&lt;/div&gt;
  &lt;div class="foo"&gt;g&lt;/div&gt;
 &lt;/div&gt;
&lt;div class="foo"&gt;h&lt;/div&gt;
&lt;span&gt;&lt;/span&gt;​
</code></pre>

<p>link for examle.</p>

<p>jquery code:</p>

<pre><code>var modWidth = 50;
$('#wrap_all').hover(function() {
    $(this).warpAll()
    $(this).css("background", "green");
    $(this).css("border", "3px double red");
    $(this).width(modWidth);


}, function() {
        $(this).css("background", "#cac");
         $(this).width(40);
    });
</code></pre>
