How do I change an event's background color with different colors, in fullcalendar?

Since you are using the latest version (1.5), you can set the backgroundColor property.

{
  title: 'Teste1',
  start: new Date(y, m, d, 10, 30),
  allDay: false,
  editable: false,
  backgroundColor: '#SomeColor'
},
{
  title: 'Teste2',
  start: new Date(y, m, d, 11, 40),
  allDay: false,
  backgroundColor: '#SomeOtherColor'
}   

You can also set the textColor property if you need to change that as well.


Use css and the className property.

<style>
.event {
    //shared event css
}

.greenEvent {
    background-color:#00FF00;
}

.redEvent {
    background-color:#FF0000;
}
</style>

<script>
$('#calendar').fullCalendar({
      editable: true,             events: [
          {
              title: 'Teste1',
              start: new Date(y, m, d, 10, 30),
              allDay: false,
                editable: false,
              className: ["event", "greenEvent"]
          },
          {
              title: 'Teste2',
              start: new Date(y, m, d, 11, 40),
              allDay: false,
              className: ["event", "redEvent"]
          }           ], eventColor: '#378006'        });
</script>