title: add a start div tag to the element and end div tag to another element
body: <p>I have this html structure (refer below)</p>
  
  <pre><code>&lt;div class="pagination_info"&gt;&lt;/div&gt;
  &lt;div class="pagination_numbers"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Now, what I want is to add a start div tag before the .pagination_info div and add end div tag after the .pagination_numbers div so the expected output must be (refer below)</p>
  
  <pre><code>&lt;div class="pagination_wrapper"&gt;
      &lt;div class="pagination_info"&gt;&lt;/div&gt;
      &lt;div class="pagination_numbers"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>what I tried so far is (refer below)</p>
  
  <pre><code>$('.pagination_info').before('&lt;div class="pagination_wrapper"&gt;');
  $('.pagination_numbers').after('&lt;/div&gt;');
  </code></pre>
  
  <p>so supposedly, what im trying to achieve is to wrap the .pagination_info div and .pagination_numbers with a parent div that has a class name "pagination_wrapper" but sadly unsuccessful yet. Any help, suggestion, recommendation, ideas, clues to make this work will be greatly appreciated. Thank you.</p>