I found what I was looking for here: https://stackoverflow.com/questions/30732181/add-new-row-of-color-palettes-in-iris-color-picker
I have several palettes on one page and I added some rows to the code when having more then one palette in one page
...setup options...
$('.my-color-field').iris(options);
$('.iris-palette').css({'height':'20px','width':'20px', 'margin-left':'','margin-right':'3px','margin-top':'3px'});
$('.iris-strip').css('height','140px');
//Nr of palette-areas? This is need if you have several
//palettes on one page (else the palette-box would have an
//unnessary large height)
var paletteareasCount = $('.palette-area').length;
var paletteCount = Math.ceil( $('.iris-palette').length / paletteareasCount);
var paletteRowCount = Math.ceil(paletteCount / 8);
$('.iris-picker').css({'height': 150 + (paletteRowCount * 23)+'px', 'padding-bottom':'15px'});
html
<div class="palette-area"><input type="text" value="#ccbbaa" class="my-color-field" /></div>
<div class="palette-area"><input type="text" value="#ccbbaa" class="my-color-field" /></div>
<div class="palette-area"><input type="text" value="#ccbbaa" class="my-color-field" /></div>
jsFiddle:
http://jsfiddle.net/g4ucnquz/6/