Div element getting replaced instead of filled

I recently wrote a CKEditor plugin to add captions to images, it works all pretty except for 1 thing.

The code of the caption when created looks like this:

<div class="caption_container">
     <img src="image.jpg" />
     <div class="caption_text">
         Caption
     </div>
</div>

When I select the "Caption" text and click the ordered list button, the caption_text div element changes into an ul instead of the ul being added to the div

Result:

<div class="caption_container">
     <img src="image.jpg" />
     <ul class="caption_text">
         <li>First item</li>
     </ul>
</div>

The result I would like to get is:

<div class="caption_container">
     <img src="image.jpg" />
     <div class="caption_text">
         <ul>
             <li>First item</li>
         </ul>
     </div>
</div>

Is there a way to achieve this?