Add a start div tag to an element tag and an end div to another element

I have this html structure (see below)

<div class="pagination_info"></div>
<div class="pagination_numbers"></div>

      

        
        
        
      

    

Now I want to add a div start tag before div.pagination_info and add a div end tag after div.pagination_numbers so the expected result should be (see below)

<div class="pagination_wrapper">
    <div class="pagination_info"></div>
    <div class="pagination_numbers"></div>
</div>

      

        
        
        
      

    

what i have tried so far (see below)

$('.pagination_info').before('<div class="pagination_wrapper">');
$('.pagination_numbers').after('</div>');

      

        
        
        
      

    

so presumably what I am trying to achieve is to wrap the .pagination_info div and .pagination_numbers with a parent div that has the class name "pagination_wrapper", but unfortunately not successful yet. Any help, suggestion, advice, ideas, hints for doing this work would be greatly appreciated. Thank.