how to add onchange event to ul tag elements?

Question

I have a drop down with set of 'ul' and 'li' like this,

<div style="float:left;">
    <div class="group">
        <div style="width:80px;">Dropdown<i class="fa fa-caret-down"></i></div>
            <ul style="float:left;">
                <li><a href="javascript:void(0);">Option1</a></li>
                <li><a href="javascript:void(0);">Option2</a></li>
                <li><a href="javascript:void(0);">Option3</a></li>
            </ul>
    </div>
</div>

I want to add onchange() event to ul tag. I can say onchange i have to call one function SelectedItem(optionselected) with selected 'li' text as parameter.Anyone Please help me. Thank you.

Answer 1

The change event is sent to an element when its value changes. This event is limited to elements, <textarea> boxes and <select> elements. For select boxes, checkboxes, and radio buttons, the event is fired immediately when the user makes a selection with the mouse, but for the other element types the event is deferred until the element loses focus.

see http://api.jquery.com/change/

So .change() doesn't work on an unordered list...

Use click event for it

    $('li').click(function(){
     //your code
 });