usergroup legend hover

[Dr.CustUmz]

thats perfect dave, exactly what im going for and i didnt think of giving them an additional tag that included their usergroup -_- didnt think it was that simple =)

some reason i cant get this working i had it semi working when i had it all in forumhome_loggedinusers template that causes it to repeat though cause it prints that template for each user, but when i add it properly

FORUMHOME:

<div class="usersonline">$activeusers</div>
<div class="legend">
	<span usergroup="6">Administrator</span> <span usergroup="2">Member</span>
</div>

FORUMHOME_LOGGEDINUSER:

<if condition="$show['comma_leader']">, </if>$stylevar[dirmark]<a usergroup="$loggedin[usergroupid]" href="member.php?$session[sessionurl]u=$loggedin[userid]">$loggedin[musername]</a>$loggedin[invisiblemark]$loggedin[buddymark]

HEADER:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(".legend span").hover(function(){
	usergroup = $(this).attr('usergroup');
	$(".usersonline a").each(function(){
		if($(this).attr('usergroup') != usergroup){
			$(this).hide();
		}
	});
}, function(){
	$(".usersonline a").show();
});
</script>

its not working... i have no errors in the console... and the html generates perfect... am i missing something...

HTML OUTPUT:

<div class="usersonline"><!-- BEGIN TEMPLATE: forumhome_loggedinuser -->
<a usergroup="6" href="http://dirtrif.com/members/drcustumz.html">DrCustUmz</a>
<!-- END TEMPLATE: forumhome_loggedinuser --><!-- BEGIN TEMPLATE: forumhome_loggedinuser -->
, <a usergroup="2" href="http://dirtrif.com/members/drbot.html">DrBot</a>
<!-- END TEMPLATE: forumhome_loggedinuser --></div>
<div class="legend">
	<span usergroup="6">Administrator</span> <span usergroup="2">Member</span>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(".legend span").hover(function(){
	usergroup = $(this).attr('usergroup');
	$(".usersonline a").each(function(){
		if($(this).attr('usergroup') != usergroup){
			$(this).hide();
		}
	});
}, function(){
	$(".usersonline a").show();
});
</script>

FIXED BY PLACING SCRIPT IN HEADER
now need to get rid of the commas if theyre not needed....