crankshaft crankshaft - 1 year ago 114
Javascript Question

Get Clicked <li> from <ul onclick>

As a relative beginner with JS, I am struggling to try and find a solution to this.

I need to find out which line of an unordered list was clicked

<ul onclick="alert(;">
<li id=l1>Line 1</li>
<li id=l2>Line 2</li>
<li id=l3>Line 3</li>

I don't really want to add a onclick event to each individual line, I'm sure there must be a way ??

Answer Source

You can use for this:


// IE does not know about the target attribute. It looks for srcElement
// This function will get the event target in a browser-compatible way
function getEventTarget(e) {
    e = e || window.event;
    return || e.srcElement; 

var ul = document.getElementById('test');
ul.onclick = function(event) {
    var target = getEventTarget(event);


<ul id="test">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>


Please note that this is a very basic example and you will likely encounter some problems when you delegate events to elements containing more than one level. When this happens, you will have to traverse the DOM tree upwards to find the containing element.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download