javascript - Getting unique class names and looping through them -


so have html:

<div class="videos">     <div class="video year-2013">...</div>     <div class="video year-2013">...</div>     <div class="video year-2013">...</div>      <div class="video year-2012">...</div>     <div class="video year-2012">...</div>     <div class="video year-2012">...</div> </div> 

my jquery should following transformation:

<div class="videos">     <div class="videogroup group-2013">         <div class="video year-2013">...</div>         <div class="video year-2013">...</div>         <div class="video year-2013">...</div>     </div>      <div class="videogroup group-2012">         <div class="video year-2012">...</div>         <div class="video year-2012">...</div>         <div class="video year-2012">...</div>     </div> </div> 

my plan unique years connected year- classes (so array of containing 2013 , 2012 in case) , iterate through each one, selecting corresponding <div>s , applying transformation.

my question how can use jquery create array holding years year- class while making sure values unique , not manually entered?

previously, tried looping through elements , grabbing classes included classes (like video class). not mention, wanted grab year didn't case.

an example of tried previously:

var years = [];  $('[class*=year-]').each(function() {     years.push($(this).attr('class')); });  console.log(years); 

the code fails because i'm storing whole classes , not removing duplicates - both things i'm not sure how do.

i javascript coding exercise in morning:

// find unique classes var uniqueclasses = {}; $(".videos div").each(function() {         var classes = $(this).attr('class').split(/\s+/);     $.each(classes, function(index, classname) {         // ignore "video" class         if (classname === "video") {             return;         }         uniqueclasses[classname] = true;       });     });  // restructure dom, wrapping each set of unique classes $.each(uniqueclasses, function(classname) {      var groupclass = "group-" + classname.split("-")[1];     $("." + classname).wrapall($("<div/>")                            .addclass("video-group")                            .addclass(groupclass)); }); 

jsfiddle here: http://jsfiddle.net/dmillz/znxhl/

hope helps!


Comments

Popular posts from this blog

How to mention the localhost in android -

php - Calling a template part from a post -

c# - String.format() DateTime With Arabic culture -