Question

I want to loop my click events, to make the code shorter. I might have 30 of these values later on.

My working code

$(document).ready(function () {
    var last_click = '';

    $("#title").click(function() { last_click = 'title'; });
    $("#subtitle").click(function() { last_click = 'subtitle'; });
    $("#test").click(function() { last_click = 'test'; });
});

This is how I want it (not working)

My guess is that the each-loop runs on dom ready and then never again and that way the click-event can never be triggered?

$(document).ready(function () {
    var last_click = '';
    var contents = new Array();
    contents = ['title', 'subtitle', 'test'];

    $.each(contents , function(index, value){
        $("#" + value).click(function() { last_click = value; });
    });
});

If there is not solved like I would, I would be thankful for a nice workaround.

Answer 1

I would rather add a class to all elements you want to bind this to, eg class="last-click"
and define the binding once as:

$(".last-click").on('click', function() {
    last_click = this.id;
}