title: jQuery attr() method to create a data dash attribute
body: <p>I'm trying to figure out why when adding a data-attribute to (Let's say an image) requires the attribute name to be put into quotes. I know that it needs to be done, but if a student asked me I wouldn't have the exact answer why. So take the two examples below. </p>
  
  <p>1.) I'm looking for an explanation why the dash is a problem.<br>
  2.) Is there a way to escape it so you don't need to put it in quotes?</p>
  
  <p><strong>This Doesn't work:</strong></p>
  
  <pre><code>$("img").attr({
      alt: "a picture of my cat",
      data-item : "pet",
      data-color : "orange",
  });
  </code></pre>
  
  <p><strong>This Does work</strong></p>
  
  <pre><code>$("img").attr({
      alt: "a picture of my cat",
      'data-item' : "pet",
      'data-color' : "orange",
  });
  </code></pre>
  
  <p>3.) The arguments that are passed to the attr() method is an object literal right?<br>
  4.) Is this just a rule in object literal syntax that a dash is not allowed?</p>