Left and Right aligned CSS List

I'm trying to create this cool idea I had for a list but cant seem to figure it out.

Basically, the list items (bullets) are centered and the first list item text is on the left then the next list item is on the right. Then continues. My idea was to create a row with two columns from Bootstrap. Column #1 is left and column #2 is right side bullets. Then I was going to try to align the bullets into the middle and align the odds (left) text to the right (text-align: right) and the opposite for the right side.

Anyone have suggestions on how to do this? I think its a cool idea but Im not quite sure how to do it.

          <div class="row">
                <div class="col-xs-6">
                    <ul class="odds_ul">
                          <li id="odds_li">Text for left side #1</li>
                          <li id="odds_li">Text for left side #3</li>
                    </ul>
                </div>
                <div class="col-xs-6">
                     <ul class="even">
                            <li id="even_li">Text for right side  Bullet #2</li>
                             <li id="even_li">Text for right side #4</li>
                        </ul>
                </div>
        </div>
    ```