Insert div containers by class numbers

Question

I'm trying to get some div boxes to be inserted at specific positions. Here's my first attempt:

$('[class*=order-]').each(function() {
    /* 1. Store info */
   var orderClass = $(this);
   console.log(orderClass);

   /* 2. Find the insert number */
   var orderClassResults = orderClass.match('order-');
   console.log(orderClassResults);

   /* 3. Use the insert number to reposition */
});

I'm stuck on step #2 of just extracting the number to be used for positioning. Am I using match() correctly to find the 'order-' class name?

Here's a working example: http://play.meyouand.us/140418-rearrange/rearrange1.html

Answer 1

To get the number you can try with the following regex

var cl = orderClass.prop('class').split(/\s+/);  //split the classes to get an array
var clNumber = $.each( cl, function(index, val){ //iterate over ir
if (val.indexOf('order-') !== -1) {  //find the match
    return val.replace( /^\D+/g, '')  // return back the number
    }
});

Answer 2

Add attr('class') in order to get the class attribute.

$('[class*=order-]').each(function() {
    /* 1. Store info */
   var orderClass = $(this).attr('class');
   console.log(orderClass);

   /* 2. Find the insert number */
   var orderClassResults = orderClass.match('order-');
   console.log(orderClassResults);

   /* 3. Use the insert number to reposition */
});

In a single line you can get orderClassResults:

$('[class*=order-]').each(function() {

   /* 1. Find the insert number */
   var orderClassResults = $(this).attr('class').match('order-');
   console.log(orderClassResults);

   /* 2. Use the insert number to reposition */
});