Как сохранить выбранный порядок выбранного и передать значение по выбранному порядку

<div>
    <em><label for="multiple-label-example">Click to Highlight Multiple Select</label></em>
    <select id="multiple-label-example" name="cond-fields[]" tabindex="-1" style="width: 350px; display: none;" class="chosen-select" multiple="" data-placeholder="Your Favorite Types of Bear">
        <option value=""></option>
        <option>American Black Bear</option>
        <option>Asiatic Black Bear</option>
        <option>Brown Bear</option>
        <option selected="">Giant Panda</option>
        <option>Sloth Bear</option>
        <option>Sun Bear</option>
        <option>Polar Bear</option> 
        <option>Spectacled Bear</option>
    </select>
    <div class="chosen-container chosen-container-multi" style="width: 350px;" title="" id="multiple_label_example_chosen">
        <ul class="chosen-choices">
            <li class="search-choice"><span>Giant Panda</span>
                <a class="search-choice-close" data-option-array-index="4"></a>
            </li>
            <li class="search-field">
                <input type="text" style="width: 25px;" autocomplete="off" class="" value="Your Favorite Types of Bear" tabindex="18">
            </li>
        </ul>
        <div class="chosen-drop">
            <ul class="chosen-results">
                <li class="active-result" style="" data-option-array-index="1">American Black Bear</li>
                <li class="active-result" style="" data-option-array-index="2">Asiatic Black Bear</li>
                <li class="active-result" style="" data-option-array-index="3">Brown Bear</li>
                <li class="result-selected" style="" data-option-array-index="4">Giant Panda</li>
                <li class="active-result" style="" data-option-array-index="5">Sloth Bear</li>
                <li class="active-result" style="" data-option-array-index="6">Sun Bear</li>
                <li class="active-result" style="" data-option-array-index="7">Polar Bear</li>
                <li class="active-result" style="" data-option-array-index="8">Spectacled Bear</li>
            </ul>
        </div>
    </div>
</div>

как поддерживать выбранный порядок выбранного. я выбираю следующий порядок в моей форме Brown Bear, Asiatic Black Bear , Giant Panda , American Black Bear

но он передает значение, подобное следующему

cond-fields[]  - American Black Bear
cond-fields[]  - Asiatic Black Bear
cond-fields[]  - Brown Bear
cond-fields[]  - Giant Panda

как поддерживать выбранный порядок и передавать значение по выбранному порядку, демонстрационная ссылка http://harvesthq.github.io/chosen/