How to make a Bootstrap radio button continue into a dropdown menu

Question

I would like to have a radio button with a couple options showing, and the rest available in a dropdown menu. I can get the interactions I want by assigning every option to a class, but I would like the color of the dropdown menu to change to the active button color when one of its choices has been selected, instead of the active button color remaining with whatever always visible button was most recently selected. Is there an elegant way to do this?

Here is a fiddle with most of the functionality:
https://jsfiddle.net/nqamazgz/

<div class="btn-group" data-toggle="buttons">
    <label class="btn btn-success my_data_flag active" id="one">
        <input name="options" type="radio" checked> ONE </input>
    </label>
    <label class="btn btn-success my_data_flag" id="two">
        <input name="options" type="radio"> TWO </input>
    </label>

    <div class="btn-group">
        <label class="btn btn-success dropdown-toggle" data-toggle="dropdown">
            <span id="text"> More Options </span><span class="caret"></span>
        </label>
        <ul class="dropdown-menu" id="divNewNotifications">
            <li><a class="my_data_flag" id="three"> THREE </a></li>
            <li><a class="my_data_flag" id="four"> FOUR </a></li>
        </ul>
    </div>
</div>


<!-- The following updates the text of the dropdown,
     only works if this code is after the above html -->
<script>
    $('.dropdown-toggle').dropdown();
    $('#divNewNotifications li > a').click(function(){
    if (this.text !== ' More Options ')
        $('#text').text($(this).html());
    });
</script>

Any tips would be appreciated, thanks.

Answer 1

A bit hacky but, building on Alex's answer:

I added a label ID to select it : id="xyz" then in the javascript, remove the active flag for all class that have my_data_flag and finally added it on the label back.

$('.dropdown-toggle').dropdown();
    $('#divNewNotifications li > a').click(function(){
    if (this.text !== ' More Options ') {
        $('#text').text($(this).html());
        $('.my_data_flag').removeClass('active');
        $('#xyz').addClass('active');
    }
    });

https://jsfiddle.net/nqamazgz/5/