Jquery Select Dynamic ID

Question

I'm trying to toggle the visibility of this. You'll notice there's a primary key number at the end of the id:

<div id="campaign-details-container-12">

And this is how I've tried to select it:

$(document).on("click",".show-details",function () {
    $(this).blur();
    var id = $(this).data("id");
    var selector = "#campaign-details-container-"+id;
    alert(selector);

    $(selector).toggle();
    return false;
});

How can I get this to work? I could put a data-id="12" tag in the div instead and use a class, but how would I select by that?

Answer 1

Just select it using the attribute starts with syntax:

$("[id^=campaign-details-container]");

No need to go do unnecessary things with classes and id variables...

See http://www.w3schools.com/cssref/sel_attr_begin.asp