Convert <div> to <p>
<p>I have a container div which has a couple of other divs:</p>

<pre><code>&lt;div class='container'&gt;
 &lt;div&gt;one&lt;/div&gt;
 &lt;div&gt;two&lt;/div&gt;
 &lt;div&gt;three&lt;/div&gt;
 &lt;div&gt;four&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I would like to change all the divs in the container div to ps, so that it looks like:</p>

<pre><code> &lt;div class='container'&gt;
 &lt;p&gt;one&lt;/p&gt;
 &lt;p&gt;two&lt;/p&gt;
 &lt;p&gt;three&lt;/p&gt;
 &lt;p&gt;four&lt;/p&gt;
&lt;/div&gt;
</code></pre>

<p>How can i accomplish this through jquery? Thanks in advance.</p>

<p><strong>EDIT:</strong> 
I apologize for the lack of clarity, to be precise, i have more than one div container, each of which has other divs inside of it. I don't think the answers already provided will only change the divs contained by div container, but will change all the divs:</p>

<pre><code>&lt;!--block one--&gt;
 &lt;div class='container'&gt;
 &lt;div&gt;one&lt;/div&gt;
 &lt;div&gt;two&lt;/div&gt;
 &lt;div&gt;three&lt;/div&gt;
 &lt;div&gt;four&lt;/div&gt;
&lt;/div&gt;

 &lt;!--block two--&gt;
  &lt;div class='container'&gt;
 &lt;div&gt;one&lt;/div&gt;
 &lt;div&gt;two&lt;/div&gt;
 &lt;div&gt;three&lt;/div&gt;
 &lt;div&gt;four&lt;/div&gt;
&lt;/div&gt;

  &lt;!--block three--&gt;
  &lt;div class='container'&gt;
 &lt;div&gt;one&lt;/div&gt;
 &lt;div&gt;two&lt;/div&gt;
 &lt;div&gt;three&lt;/div&gt;
 &lt;div&gt;four&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>and so on. what i need is that only the divs inside the div class container are changed into p's:</p>

<pre><code>  &lt;div class='container'&gt;
   &lt;p&gt;one&lt;/p&gt;
   &lt;p&gt;two&lt;/p&gt;
   &lt;p&gt;three&lt;/p&gt;
   &lt;p&gt;four&lt;/p&gt;
  &lt;/div&gt;


 &lt;div class='container'&gt;
   &lt;p&gt;one&lt;/p&gt;
   &lt;p&gt;two&lt;/p&gt;
   &lt;p&gt;three&lt;/p&gt;
   &lt;p&gt;four&lt;/p&gt;
  &lt;/div&gt;
</code></pre>

<p>there's a small plugin to do it,:</p>

<pre><code>  (function($) {
   $.fn.changeElementType = function(newType) {
    var attrs = {};

    $.each(this[0].attributes, function(idx, attr) {
        attrs[attr.nodeName] = attr.nodeValue;
    });

    this.replaceWith(function() {
        return $(\"&lt;\" + newType + \"/&gt;\", attrs).append($(this).contents());
     });
     }
     })(jQuery);
</code></pre>

<p>to use:</p>

<pre><code>$(\"div\").changeElementType(\"p\");
</code></pre>

<p>But won't doing that change all the divs to ps? How would i modify it to target only the divs inside the div in class container? Thank you.</p>
