Get Paragraph Text into Section

by Santosh Thakur

HTML

<article>
  <h1>My Awesome Post</h1>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
  <p>
    <span class=co>Lorem ipsum dolor sit amet</span>, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt
    ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
  <p>
    Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <span class=co>Hello from JavaScript.</span>    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
</article>

CSS

article {
  width: 600px;
  margin: auto;
}

blockquote.co {
  float: right;
  background: #e3e3e3;
  font-size: 2em;
  width: 35%;
  text-align: center;
}

JavaScript

(function() {

  var co = $('article').find('span.co').each(function() {
    var $this = $(this);

    $('<blockquote></blockquote>', {
      class: 'co',
      text: $this.text()
    }).prependTo($this.closest('p'));

  });

})();