Как узнать индекс элемента по которому произведен клик?

Question

[Banny_Boom]

<ul class="settings">
    <li>Кнопка</li>    
    <li>Кнопка2</li>
    <li>Кнопка3</li>
</ul>

Как узнать по какому элементу списка произведен клик?
var element = document.querySelectorAll(.settings li);
Цикл и т.д

Подскажите пожалуйста как это сделать, у меня не получается, нагуглить не могу..

и ещё консоль стала выдовать:

Resource interpreted as Image but transferred with MIME type text/html: "http://web/image/users/profile_photo/%7B%7Bprofile_photo%7D%7D.jpg".

Хотя файл no_photo.jpg существует..

Answer 1

[Aves]

document.querySelector('ul').addEventListener('click', function(e) {
    if (e.target.nodeName == 'LI') {
        var index = Array.prototype.indexOf.call(e.target.parentNode.children, e.target);
    }
});