bootstrap-timepicker class does not allow to jquery to select the timepicker element

[monterey01]

Sample code

    alert($("#" + jquerySelectorEscape("dayAndTimesOpenAndClosed.openCloseTimes[7].openTime")).attr('id')); returns undefined for below html/javascript

HTML/JAVASCRIPT

    <label for="dayAndTimesOpenAndClosed.openCloseTimes0.openTime">Open
        Time</label>
    <div class="input-append bootstrap-timepicker ">
        <input id="dayAndTimesOpenAndClosed.openCloseTimes[7].openTime"
            name="dayAndTimesOpenAndClosed.openCloseTimes[7].openTime"
            class="input-small" type="text" value="6:00 AM" /> <span
            class="add-on"><i class="icon-time"></i></span>



        <script type="text/javascript">
            $(
                    "#"
                            + jquerySelectorEscape("dayAndTimesOpenAndClosed.openCloseTimes[7].openTime"))
                    .timepicker();
        </script>
    </div>

</div>