//jQueryでobjectタグで埋め込んだSVG内の要素を読み込み・編集する

$(function() {

  var obj = $('<object>', {
      type  :'image/svg+xml',
    })
    .attr({
      'data' : 'svg-js-load-contents.svg',
    })
    .css({width : '400px'})
    .appendTo('#demo');
/*
	obj.on('load', function() {
		var con = obj.contents();
    
		var circle = con.find('circle');
		circle.eq(0)
    .css({cursor:'pointer'})
    .on({
			'mouseenter': function() {
				$(this).css({opacity:0.5});
		    circle.eq(1).attr({cy:100});
			},
			'mouseleave': function() {
				$(this).css({opacity:1});
		    circle.eq(1).attr({cx:100,cy:0});
			},
			'click': function() {
				$(this).css({opacity:1});
		    circle.eq(1).attr({cx:0,cy:0});
			}
		});
	});
*/

  // pure JavaScript
/*
  obj.addEventListener('load', function() {
     var con = obj.contentDocument;
     console.log(con);
     var circle = con.getElementsByTagName('circle');
     console.log(circle);
  });
*/


});

ページのソースを表示 : Ctrl+U , DevTools : F12

view-source:https://hi0a.com/demo/-svg/svg-js-load-contents/