Проверьте каждый div для id на основе значений внутри массива

Question

Я создаю набор вкладок на основе существующего набора категорий с приведенным ниже JS. Мне нужно расширить это значение для целевого идентификатора в пределах идентификатора DIV на основе значений из массива JS.

 $("#categories div[id^=category]:not(:first)", this).hide(); 

     var cats = $('#categories div[id^=category]'); 

     cats.each(function() { 
      var anch = $(this).find('h3 a').eq(1).clone(); 
      anch[0].rel = this.id; 
      $('<li/>').append(anch).appendTo('#tabs'); 
     }); 

HTML-:

<div id="category_1"> 
    <h3 class="maintitle"> 
     <a class="toggle">..</a> 
     <a href="#">Cat 1 Title</a> 
    </h3> 
    <div> 
     ... 
    </div> 
</div> 

<div id="category_2"> 
    <h3 class="maintitle"> 
     <a class="toggle">..</a> 
     <a href="#">Cat 2 Title</a> 
    </h3> 
    <div> 
     ... 
    </div> 
</div> 

У меня есть массив JS готовый, добавив:

var catsList = '{$cats}'; // comma separated list of numbers generated in PHP - returns 1,4,8 currently. 
var catsArray = catsList.split(','); 

Как преобразовать ниже, чтобы проверить для каждого элемента в catsArray ?

var cats = $('#categories div[id^=category]'); 

Что-то вроде

var cats = $('#categories div[id^=category_'+catsArray+']'); 

но, очевидно, проверяя каждый элемент в массиве, а не весь массив как это делает.

Answer 1

Вы можете использовать это как идентификаторы должны быть уникальными на контекстной странице :

var cats = $('#category_'+catsArray.join(',#category_')); 

DEMO

Answer 2

вы, вероятно, хотите, each функцию

$.each(catsArray,function(index, item) { 
     var cats = $('#categories div[id^=category_'+item+']'); 
}); 

В зависимости от того, как вы используете это for loop будет делать также:

for (var i = 0; i < catsArray.length; i++) { 
    var catIndex = catsArray[i]; 
    var cats = $('#categories div[id^=category_'+catIndex +']'); 
}