title: JQuery getting a data attribute returning undefined
body: <p>I am trying to get the value of data-scanID from the clicked tag and store it inside a variable called scanID but the alert comes up undefined.</p>
  
  <pre><code>$("#trucklist").click(function(event) {
      var scanID=$(event.target).data("scanID");
      alert(scanID);
  });
  </code></pre>
  
  <p>The html looks something like this:</p>
  
  <pre><code>&lt;ul id="trucklist"&gt;
      &lt;li data-scanID=*somedata*&gt;
          &lt;ul&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li data-scanID=*somedata*&gt;
          &lt;ul&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li data-scanID=*somedata*&gt;
          &lt;ul&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
              &lt;li&gt;*stuff*&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>