Управление заливкой svg

На HTML - странице присутствует векторное изображение в формате .SVG. Подгружено при помощи тэга object:

<object id="somesvg" type="image/svg+xml" data="somepath" id='object'></object>

Разметка SVG-шки содержит определение стиля заливки:

... 
 <defs> 
  <style type="text/css"> 
   <![CDATA[ 
    .fil0 {fill:none} 
    .fil1 {fill:black} 
   ]]> 
  </style> 
 </defs> 
 ...

Пытаюсь при помощи JS реализовать изменение заливки этого изображения. Несколько разноцветных блоков, при клике на каждый из которых должен меняться цвет изображения на цвет фона этого блока:

<script> 
$(".color_change").click( function() { 
	var color = $(this).css('background-color');	 
	var object = document.getElementById("somesvg"); 
  var svgDocument = object.contentDocument; 
  var svgb = svgDocument.getElementsByClassName("fil1"); 
  svgb1[0].setAttribute("fill", color); 
		}); 
</script>

Скрипт успешно добавляет свойство fill к элементу класса .fil1, что видно в консоли, однако заливка SVG - изображения на странице остается неизменной. В чем моя ошибка?

P.S. Менять разметку .SVG-файла нельзя, таких файлов довольно большое количество.