title: Problems with extending jQuery (adding debugging features)
body: <p>I have the following jQuery extension method code, which provides all attributes of an element <em>as readable string</em> using <code>attrString()</code>:</p>
  
  <h2>e.g.</h2>
  
  <pre><code>$('div').attrString() returns "data-hello=Hello!, class=MyClass,"
  </code></pre>
  
  <h2>The current code looks like this:</h2>
  
  <pre><code>// Return a debug string of all the attributes of an element (first if multiple elements)
  jQuery.fn.attrString = function () {
      var result = "";
      if (this[0]) {
          $.each(this[0].attributes, function (i, attrib) {
              var name = attrib.name;
              var value = attrib.value;
              result += name + "=" + value + ", ";
          });
      }
      return result;
  };
  </code></pre>
  
  <h2>and the tests are:</h2>
  
  <pre><code>// Valid selection - multiple matches, multiple attributes
  $('#output').append("&lt;br/&gt;$('div').attrString() = " + $('div').attrString());
  
  // Valid selection - single attributes
  $('#output').append("&lt;br/&gt;$('#output').attrString() = " + $('#output').attrString());
  
  // Empty selection
  $('#output').append("&lt;br/&gt;$().attrString() = " + $().attrString());
  </code></pre>
  
  <h2>JSFiddle: <a href="http://jsfiddle.net/8T38S/2/" rel="nofollow">http://jsfiddle.net/8T38S/2/</a></h2>
  
  <h2>Questions:</h2>
  
  <ul>
  <li>Is <code>if (this[0])</code> the correct way to test for an <em>empty</em> jQuery selection?</li>
  <li>Is there a more efficient way to concatenate the attribute names and values together</li>
  <li>and what is the simplest way to do this <em>without leaving a trailing comma</em> like it 
  currently does?</li>
  <li>Is there just a better way to do this already (e.g. property in the DOM somewhere)?</li>
  </ul>