Set different background colors to article header based on article sources

InoReader_Colorful_ListView.user.js

// ==UserScript==
// @name        InoReader Colorful ListView Mod
// @name:en        InoReader Colorful ListView Mod
// @namespace   https://gist.github.com/myuhe/c2207a76f77b65b072b6
// @version     0.9.1
// @description:ja InoReaderの記事を色分け
// @description:en Set different background colors to article header based on article sources
// @author         http://sheephead.homelinux.org/
// @include        http*://www.inoreader.com/*
// @include        http*://inoreader.com/*
// @include        http*://beta.inoreader.com/*
// @include    http://jp.inoreader.com/*
// @include    https://jp.inoreader.com/*
// @grant            GM_addStyle
// ==/UserScript==
(function() {
document.getElementById("reader_pane").addEventListener("DOMNodeInserted",function (){
	var article=document.getElementsByClassName("article_header");
	for(var i=0;i<article.length;i++){
		var hue=article[i].parentNode.attributes["data-suid"].value*10%360;
		if (/article_unreaded/.test(article[i].parentNode.className)){
			article[i].parentNode.setAttribute("style","background-color:hsl("+hue+",70%,80%);");
			article[i].childNodes[3].childNodes[1].setAttribute("style","background-color:hsl("+hue+",70%,80%);");
		}else if(/\barticle\b/.test(article[i].parentNode.className)){
			article[i].parentNode.style.background="";
			article[i].childNodes[3].childNodes[1].setAttribute("style","background-color:#f2f2f2");
		}
	}
},false);

    GM_addStyle(
        ".ar {   position:relative!important;margin:0!important; }" +
            ".article_header_text{   padding-left:58px;   min-width:0px!important; } " +
            ".ar .arrow_div{   position:static!important;   float:left!important; } " +
            ".ar .arrow_div .header_buttons{   position:absolute!important;   left:20px!important;   top:0px!importopant;   right:auto!important; } " +
            ".ar.ar_showed .arrow_div{   top:0px!important;   right:6px!important; } " +
            ".ar .arrow_div .header_date{   position:absolute!important;   z-index:99!important;   color:#000!important;   right:0px !important;   top:-5px;   width:30px!Important;   padding:9px 0px 9px 10px!important;   opacity:1!important; }" +
            ".article_current .header_date{background:none!important;} .article_header .feed_favicon{margin-top:0px!important;}" +
            ".block_article_ad,.ad_title,.inner_ad{display: none!important;}#sb_rp_tools,#sb_rp_notifications,#sb_rp_gear{margin-right:-60px!important;}#sb_rp_upgrade_button{display: none!important;}" +
            ".article_current_collapsed div.arrow_div {background-color:hsl(10,85%,95%) !important;}" +
            "div.article_current_collapsed {background-color:hsl(10,85%,95%) !important;}"
    );


})();