Q:

Copying multiple attributes to one element

I'm currently having some trouble trying to copy all the attributes from a bunch of list items into the first list item.
I want to add the first list item (All) to the top of the list and then copy all of the data-filter attributes from the elements below into All, so they appear like data-filter=".ant, .bee, .bug, .moth"
here is alink to my jsfiddle: http://jsfiddle.net/8e4Kv/1/
Any suggestions would be greatly appreciated,
Thanks!
Big D

A:

Something like below will do the job,
DEMO
$(function() {

    var $li = $('ul li[data-filter]');

    var allAttr = [];        
    $li.each (function () {
        allAttr.push ($(this).attr('data-filter'));
    });

    $('<li>All</li>')
      .insertBefore('ul li:first-child')
      .attr('data-filter',allAttr.toString());

});

