Untitled

<html>
    <head>
        <script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/jquery-ui.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        <link rel='stylesheet' href='c:/users/william/aw/static/css/index.css'>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <meta charset='utf-8'>
        <meta name='viewport' content='width=device-width, initial-scale=1'>
    </head>
    <body id='campaignBuilder' class=''>
        <div class='container-fluid'>
                <ul class='selectType breadcrumb text-center' id='campaignType'>
                    <li id='sms'><a href=''>SMS</a></li>
                    <li id='email'><a href=''>Email</a></li>
                    <li id='messenger'><a href=''>Messenger</a></li>
                </ul>
            </div>
        </div>
        <div id='SMS'>
            <div class='container-fluid'>
                <div class='row'>
                    <div class='col-lg-6 text-center' id='smsBuilder'>
                        <h4 style='text-decoration: underline'>Build your SMS campaign</h4>
                        <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#entryPoint">Add Start</button>
                        <div id='entryPoint' class='modal fade' role='dialog'>
                            <div class='modal-dialog'>
                                <div class='modal-content'>
                                    <div class='modal-header'>
                                        <button type='button' class='close' data-dismiss='modal'>%times;</button>
                                        <h4 class='modal-title'>Edit Starter</h4>
                                    </div>
                                    <div class='modal-body'>
                                        <p>Edit your starter here</p>
                                    </div>
                                    <div class='modal-footer'>
                                        <button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class='col-lg-6 text-center' id='smsPhone'>
                        <h4 style='text-decoration: underline'>All changes will be reflected here</h4>
                    </div>
                </div>
            </div>
        </div>
        <div id='email' style='display: none'>
        </div>
        <div id='messenger' style='display: none'>
        </div>
    </body>
    <script>
        (function() {
            var ul = $('#campaignType')[0],
                children = ul.children;
            for (let i = 0; i < children.length; i ++) {
                let li = children[i];
                li.onclick = function() {
                    if (li.id == 'sms') {
                        alert('sms')
                    }
                    else if (li.id =='email') {
                        alert('email')
                    }
                    else {
                        alert('messenger')
                    }
                }
            }
        })();
    </script>
</html>