Question

I’ve just wrote the code below to add a class to the outer div where it matches. Now I know there must be a more elegant way to achieve the below!

if ($(".cur").hasClass("one")) { $("#outer").addClass("one"); }
if ($(".cur").hasClass("two")) { $("#outer").addClass("two"); }
if ($(".cur").hasClass("three")) { $("#outer").addClass("three"); }
if ($(".cur").hasClass("four")) { $("#outer").addClass("four"); }
if ($(".cur").hasClass("five")) { $("#outer").addClass("five"); }
if ($(".cur").hasClass("six")) { $("#outer").addClass("six"); }

Any improvements will be gladly received 🙂

Answer 1

var classNames = '';    
$('.cur').each(function(){
    if (classNames.indexOf(this.className + ' ') === -1)
        classNames += this.className + ' ';
});

var classes = classNames.split​(" ");​​​
var $outer = $('#outer');    
$.each(classes, function(index, value){
    if (value !== 'cur')  
        $outer.addClass(value);
});

Live DEMO

Notes:

• With this code you don’t need to “burn” the classes of .cur in the code, it’s done automatically.
• It will copy all the classes of .cur (except cur itself), so it’s up to you to decide if it’s good for you or not.