Esse javascript deve alterar o HTML da lista suspensa, bem como alterar o conteúdo das div correspondentes. O primeiro clique altera o html suspenso, mas você não pode alterá-lo novamente e perde a pequena seta no menu suspenso que permite que os usuários saibam que é um menu suspenso. As caixas de seleção preencher não preenchem a div porque eu não sei como fazer javascript, deixe-me colocar / remover caixas de seleção

JAVASCRIPT:

    function changeSelection() {
        var x = document.getElementById("populateSelection").id;

        if (x == "selectionViews") {
            document.getElementById("dropdownMenuSelect").innerHTML = "Views";
            document.getElementById("populateCheckBoxes").innerHTML = "";
        } else {
            document.getElementById("dropdownMenuSelect").innerHTML = "Tables";
            document.getElementById("unpopulateCheckBoxes").innerHTML = "";
        }
    }

supõe-se que populateCheckBoxes tenha essas caixas de seleção quando o botão de opção tabelas estiver marcado e quando o botão de opção unpopulaeCheckBoxes estiver marcado, a div estará vazia. Eu não tenho esse código em nada ainda, porque eu acredito que deveria estar no javascript, mas colando que, obviamente, não funciona

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="selectionCondition" checked/>50 million
                            </label>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="selectionDistribution"/>100 million
                            </label>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="selectionProgram"/>Status Quo
                            </label>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="selectionTreatment"/>Do Nothing
                            </label>
                        </div>

HTML:

Este html contém a lista suspensa que deveria mudar e as 2 divs que deveriam mudar

                    <form role="form">
                        <div class="row">
                            <div class="radio col-xs-2" id="populateSelection"  onchange="changeSelection()">
                                <label>
                                    <input type="radio" name="optradio" id="selectionTables" />Use Tables
                                </label>&nbsp;&nbsp;
                                <label>
                                    <input type="radio" name="optradio" id="selectionViews" />Use Views
                                </label>
                            </div>
                            <div class="dropdown col-xs-10">
                                <!--DROPDOWN BUTTON-->
                                <button class="btn btn-default dropdown-toggle btn-xs btn-orange" type="button" id="dropdownMenuSelect" data-toggle="dropdown" aria-expanded="true" style="margin-top:10px">
                                    Views
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenuSelect">
                                    <!--DROPDOWN MENU-->
                                    <li role="presentation"><a role="menuitem" tabindex="-1" class="link-no-jump" href="#graphOneChart">Chart</a></li>
                                    <li role="presentation"><a role="menuitem" tabindex="-1" class="link-no-jump" href="#graphOneData">Data</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="row" id="populateCheckBoxes"></div>
                        <div class="row" id="unpopulateCheckBoxes"></div>
                    </form>

aqui está o código de trabalho, é bem claro, mas funciona da mesma maneira,http://codepen.io/MarkBond/pen/JdOZaw?editors=101. BTW, isso é feito com bootstrap