Question

I have an element that isn’t clickable at first, but I’d like to make clicking on another div make it clickable.

What I did was

$("#div_1").addClass("selected");

$(".selected").click(function() {
    $("#block").animate({
        width: "70%",
        opacity: 0.4,
        marginLeft: "0.6in",
        fontSize: "3em",
        borderWidth: "10px"
    }, 1500);
});​

but this doesn’t seem to work, I’m not sure what’s wrong with this, maybe there’s a better way to do this?

Answer 1

Try something like this:

$("#div_1").addClass("selected");

$("#div_1").click(function() {
    if($(this).hasClass('.selected') {
    $("#block").animate({
        width: "70%",
        opacity: 0.4,
        marginLeft: "0.6in",
        fontSize: "3em",
        borderWidth: "10px"
    }, 1500);
    }
});​

Also for usability purposes when you add the click-able functionality use this to make it appear click-able to the user:

$("#div_1").addClass("selected").css('cursor', 'pointer');