Этот javascript должен изменить HTML-код выпадающего меню, а также изменить содержимое соответствующих элементов div. Первый щелчок изменяет раскрывающийся HTML-код, но вы не можете изменить его обратно, а также потеряете небольшую стрелку в раскрывающемся списке, которая позволяет пользователям узнать, что это выпадающий список. Флажки populate не заполняют div, потому что я не знаю, как сделать javascript, позвольте мне поставить / убрать флажки

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 = "";
        }
    }

Предполагается, что populateCheckBoxes должны иметь эти флажки, когда установлен переключатель с таблицей, а когда установлен переключатель с unpopulaeCheckBoxes, div будет пустым. У меня пока нет этого кода, потому что я верю, что он должен быть в javascript, но вставка в него явно не работает

                        <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:

Этот html содержит выпадающий список, который должен измениться, и 2 div, которые должны измениться.

                    <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>

Вот рабочий код, он довольно простой, но работает так же,http://codepen.io/MarkBond/pen/JdOZaw?editors=101, Кстати, это делается с помощью начальной загрузки