title: jQuery + qTip2 - Select current hover element
body: <p>I am using qTip2 to display tooltip for the table rows:</p>
  
  <pre><code>   @foreach (var item in Model)
          {
              &lt;tr id="@(item.ShopListID)"&gt;
                  &lt;td id="name@(item.ShopListFoodID)" class="shoptablename"&gt;@Html.DisplayFor(modelItem =&gt; item.Name)
                  &lt;/td&gt;
                  &lt;td id="amnt@(item.ShopListFoodID)" class="shoptableamount"&gt;@Html.DisplayFor(modelItem =&gt; item.Amount)
                  &lt;/td&gt;
              &lt;/tr&gt;
  
          }
  </code></pre>
  
  <p>I want to have the tooltip for each "Amount" field, so I initiate the tooltip like this:</p>
  
  <pre><code>    // Use ajax to add tooltip for food with stock amount
      $('.shoptableamount').qtip($.extend({}, myStyle, {
          content: {
              text: 'Loading...', // The text to use whilst the AJAX request is loading
              ajax: {
                  url: '/Shop/GetFoodAmount', 
                  type: 'GET',
                  data: { id: $('.shoptableamount').attr('id') } 
              }
          }
      }));
  </code></pre>
  
  <p>However, since i select using the class, I only get the id of the first tr, and no matter I have my mouse over on which row, I still get the some tooltip content as the first row. I tried to use $(this) to select the id, but I did not work.</p>
  
  <p>I need a selector which I can select the current hover element...</p>
  
  <p>Hope can get some help here... any feedback is appreciated... </p>
  
  <p>Thanks....</p>