title: Jquery ui dialog is opening multiple dialogs instead of one
body: <p>I am using Jquery UI dialog to display some information coming up from an asp.net mvc view list.</p>
  
  <p>so basically you go to the list, you click an icon and you get some info for the specific record as a pop up </p>
  
  <p>If there is only one dialog in the page , there is no problem , the dialog will open fine but if i want to have more than one dialog then when i click any of them all will open.</p>
  
  <p>Can you please help me with what am i doing wrong ?</p>
  
  <pre><code> &lt;td&gt;                    
                  &lt;a class="clicker" dialogid="@item.Event.EventId" href="#"&gt; Catering Details &lt;/a&gt;
                  &lt;div class="dialog @item.Event.EventId" title=""&gt; 
                       &lt;p&gt;@{Html.RenderAction("ViewEvent", "Home", new { EventId = item.Event.EventId });}&lt;/p&gt;
                       &lt;/div&gt;
  
  
                    @if (item.Event.SpecialRequirements != null)
               {
                    &lt;img class="clicker2" dialog2id="@item.Event.EventId" style="margin-left:3px;display:inline;margin-bottom:-3px;cursor: pointer;" title="Special Requirements" src="~/Images/email-alert-icon.png"  /&gt; 
                       &lt;div class="dialog @item.Event.EventId" title="Special Requirements"&gt; 
                       &lt;p&gt;@item.Event.SpecialRequirements&lt;/p&gt;
                       &lt;/div&gt;
               }  
  
          &lt;/td&gt;
  
  &lt;script&gt;
      $m = jQuery.noConflict();
  &lt;/script&gt;
  &lt;script&gt;
  
      $m(function ()
      {
  
          $m('.dialog').dialog({
            autoOpen: false,
            show: { effect: "blind", duration: 1000 },
            hide: { effect: "explode", duration: 1000 },
            width:'800px',
            buttons: {
                Close: function () {
                    $m(this).dialog("close");
                }
            }
          });
  
        $m(".clicker").on("click", function () {
            $m("." + $(this).attr('dialogid')).dialog("open");
        });     
  
        $m(".clicker2").on("click", function () {
            $m("." + $(this).attr('dialog2id')).dialog("open");
        });
  
    });
  
  &lt;/script&gt;
  </code></pre>