click() on classes

I want to create a dialog using jQuery that opens when an element with a certain class gets clicked. The title should be read from a data

HTML:

<div class="clickme" data-dialogtitle="Foo">First Button</div>
<div class="clickme" data-dialogtitle="Bar">Second Button</div>

JavaScript:

$("开发者_StackOverflow社区#dialog").dialog({
  autoOpen: false
});

$(".clickme").click(function () {
  var title = $(this).data("dialogtitle");
  $("#dialog").dialog("option", {title: title});
  $("#dialog").dialog("open");
});

However it tells me $(".clickme").click() isn't a function. How can I fix this?

If you're getting an error that $(".clickme").click() isn't a function, it sounds as though you haven't included jQuery on the page or your code trying to use it is in a script tag that's earlier on the page than the script tag containing jQuery.

Here's an example of how your page might load jQuery and jQuery UI. The code itself is verbatim from your question, but this page references the scripts and such. Here's a second example demonstrating the use of ready (indirectly, through the shortcut for it), although if you can just use the first technique (your script at the end of the body), that's preferred; more here.