Generated by SassMeister.com.

SassMeister-input-HTML.html

<ul>
  <li class="red">
    test1
  </li>
  <li class="blue">
    test2
  </li>
  <li class="green">
    test2
  </li>
</ul>

SassMeister-input.scss

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----

$colors: (
  "blue": #000080,
  "red": #A00000,
  "green": #00A000,
);

@each $i, $value in $colors  {
  li.#{$i} {
    cursor: pointer;
    color: $value;
    
    &:hover {
      color: lighten($value, 20%);
    }
  }
}

SassMeister-output.css

li.blue {
  cursor: pointer;
  color: #000080;
}
li.blue:hover {
  color: #0000e6;
}

li.red {
  cursor: pointer;
  color: #A00000;
}
li.red:hover {
  color: #ff0707;
}

li.green {
  cursor: pointer;
  color: #00A000;
}
li.green:hover {
  color: #07ff07;
}

SassMeister-rendered.html

<ul>
  <li class="red">
    test1
  </li>
  <li class="blue">
    test2
  </li>
  <li class="green">
    test2
  </li>
</ul>