How to loop using php array

How to loop using php array

I'm using a jquery color picker that adds a block of code for each color. I have changed it so it uses a predefined value from php code so it looks like this
 
  1.  $("#<?php echo $colorsArray[0]; ?>").spectrum({ 
          showInitial: true,
          showInput: true,
          showPalette: true,
          showSelectionPalette: true,
          palette: [
              ['black', 'white', 'blanchedalmond'],
              ['rgb(255, 128, 0);', 'hsv 100 70 50', 'lightyellow']
          ],
          localStorageKey: "my_colors", 
      }); 









 
The block of code is the same for every color except the $colorsArray[0] line is changed to $colorsArray[1], $colorsArray[2] and so on.
 
The above works fine but I have 11 colors so far and they will probably increase so I would like to do something like the following to reduce the code size but the array index is not valid
  1.  for (var i = 0; i < 11; i++) {
  2.   $("#<?php echo $colorsArray[i]; ?>").spectrum({ 
          showInitial: true,
          showInput: true,
          showPalette: true,
          showSelectionPalette: true,
          palette: [
              ['black', 'white', 'blanchedalmond'],
              ['rgb(255, 128, 0);', 'hsv 100 70 50', 'lightyellow']
          ],
          localStorageKey: "my_colors", 
      }); 









  3. } 
 
Is there a way to code this so it will work?