title: Add class from child to each parent with jQuery each and addClass
body: <p>I have the following html</p>
  
  <pre><code>&lt;div class="blog-posts"&gt;    
    &lt;div class="post"&gt;&lt;span class="ptype" data-type="article-blog"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post"&gt;&lt;span class="ptype" data-type="article-snippet"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post"&gt;&lt;span class="ptype" data-type="article-code"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post"&gt;&lt;span class="ptype" data-type="article-blog"&gt;&lt;/span&gt;&lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>and following css classes</p>
  
  <pre><code>.post {height:30px;border:2px solid}    
  .post.article-blog {background:red}
  .post.article-code {background:blue}
  .post.article-snippet {background:green}
  </code></pre>
  
  <p>i want to add to each <b>post</b> the class specifed by the child</p>
  
  <pre><code>&lt;span class="ptype" data-type="article-blog"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>i'm using jquery like this but it just takes the class from first child and applies to to all parents</p>
  
  <pre><code>$(document).ready(function() {
      $(".post").each(function(index, value) {
          var ptype = $(".ptype").attr("data-type");
          console.log(ptype);
          $(".post").addClass(ptype);
      });
  });
  </code></pre>
  
  <p>Any hints? here is a <a href="http://jsfiddle.net/f2gbqban/" rel="nofollow">jsFiddle</a></p>
  
  <p>This is the html i'm trying to get</p>
  
  <pre><code>&lt;div class="blog-posts"&gt;    
    &lt;div class="post article-blog"&gt;&lt;span class="ptype" data-type="article-blog"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post article-snippet"&gt;&lt;span class="ptype" data-type="article-snippet"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post article-code"&gt;&lt;span class="ptype" data-type="article-code"&gt;&lt;/span&gt;&lt;/div&gt;
    &lt;div class="post article-blog"&gt;&lt;span class="ptype" data-type="article-blog"&gt;&lt;/span&gt;&lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>