title: different color code for different group of edges in cytoscape
body: <p>I am new to cytoscape but I am investigating to use cytoscape.js to display topology of multiple airlines. I need to display flights between two countries of these airlines. My plan is to create a cytoscape instance. For every airline, create edges and nodes, and specify style. In the style, i would like to specify color for edges. However, I am not able to see different color coding I assign for every iteration. Instead, all edges and nodes, get the same color which is assigned in the last iteration.Here is my code,</p>
  
  <pre><code>var cy = cytoscape({        
      container: document.getElementById('cy'),
      elements: [
          { data: { id: 'a' } },
          { data: { id: 'b' } },
          {
            data: {
              id: 'ab',
              source: 'a',
              target: 'b'
            }
          }],
      style: [ // the stylesheet for the graph
      {
          selector: 'node',
          style: {
              'background-color': '#666',
              'label': 'data(id)'
          }
      },
      {
          selector: 'edge',
          style: {
              'width': 1,
              'line-color': '#aaa',
          }
      }
  ]});       
  
  
  var colors = ["blue", "black"];        
  for(var i = 0; i &lt; selectedAirlines.length; i++)
  {
      nodeCount ++;
      cy.add({
      data: { id: 'node' + i }
      });
      var source = 'node' + i;
      cy.add({
          data: {
              id: 'edge' + i,
              source: source,
              target: (i% 2 == 0 ? 'a' : 'b')
          }
      });
      cy.style([
          {
              selector: 'node',
              style: {
                  shape: 'hexagon',
                  'background-color': colors[i],
                  label: 'data(id)'
              }
          }]); 
  }
  </code></pre>
  
  <p>Can someone help me to find out whats going wrong here? </p>