Show Field Collection fields together in same field item

Question

I have a field collection with two fields - Image and Caption. How do I get the two fields to display in the same field item? Right now the HTML is:

<div class="ds-1col entity entity-field-collection-item field-collection-item-field-video-item view-mode-full clearfix">
<div class="field field-name-field-video-image field-type-image field-label-hidden">
    <div class="field-items">
        <div class="field-item even"><!-- image here --></div>
        <div class="field-item odd"><!-- image here --></div>
    </div>
</div>
<div class="field field-name-field-video-caption field-type-text field-label-hidden">
    <div class="field-items">
        <div class="field-item even"> <!-- image caption --></div>
        <div class="field-item odd"> <!-- image caption --></div>
    </div>
</div>

I need the HTML to be more like:

<div class="ds-1col entity entity-field-collection-item field-collection-item-field-video-item view-mode-full clearfix">
<div class="field-items">
    <div class="field-item even image">
    <!-- image field here -->
    </div>
    <div class="field-item odd caption">
    <!-- caption field here -->
    </div>
</div>

Answer 1

The problem was with how the field collection was set up. Originally, the field collection fields had unlimited values, while the field collection in the content type was limited to one value.

I reversed this so that the fields were limited to one value and the field collection has unlimited values.