<div id="bike-tail" class="inline-block"></div><div id="bike-head" class="inline-block"></div> </div> <div class="picker-wrapper inline-block"> <h3 class="title">Tail color</h3> <?php $tail = new \Kendo\UI\FlatColorPicker('tail'); $tail->attr('class', 'picker')->preview(false)->value('#000')->change('select'); echo $tail->render(); ?> </div> <div class="picker-wrapper inline-block"> <h3 class="title">Front & side color</h3> <?php $head = new \Kendo\UI\FlatColorPicker('head'); $head->attr('class', 'picker')->preview(false)->value('#e15613')->change('select'); echo $head->render(); ?> </div> </div> <script> function select(e) { $("#bike-" + this.element.attr("id")).css("background-color", e.value); } </script> <style scoped> .demo-section {