Java function in sidebar

Hello potential helpers…

I’m trying to add a second, separate search form in the sidebar (manually, no widgets). I coded it in a separate .php file, where it works perfectly. Yet when trying to load it in the sidebar via the <?php include function, one certain Java function that I implemented in the search form php file doesn’t seem to work correctly, making the form displaying wrong.

For the search form, which is radio button based, I use three different scripts:

1) the script to make the form behave like a search form:

<script type="text/javascript">
function dosearch() {
	var sf=document.repaints_search_form;
	for (i=sf.repaint_search_type.length-1; i > -1; i--) {
		if (sf.repaint_search_type[i].checked) {
			var submitto = sf.repaint_search_type[i].value + escape(sf.searchterms.value);
		}
	}
window.location.href = submitto;
return false;
}
</script>

2) The script to get the radio buttons marked when the label is clicked:

<script type="text/javascript">
function selectRadio(n){
	document.forms["repaints_search_form"]["repaint_search_type"][n].checked=true;
	}
</script>

and 3) (a.k.a. the culprit): the script to have the labels colored, depending on whether the corresponding radio button is checked or not:

<script type="text/javascript">
function setOn()
{
	var theRadios = document.getElementsByName('repaint_search_type');
	for(var i = 0; i < theRadios.length; i++)
	{
		theRadios[i].parentNode.className = 'off'; //Sets all spans class name to off
		theRadios[i].onclick = function() //assigns a function to the onclick event of the radios
		{
			setOn();
		}
		if(theRadios[i].checked == 1) //if the radio button is checked then it will give the span that its in a class name of on
		{
			theRadios[i].parentNode.className = 'on';
		}
	}
}
onload = setOn;
</script>

I’m fairly certain it’s the third script that doesn’t work well in the sidebar. I got it from here (third post), and as you can see in the search form php-file, it works perfectly by itself, in a single php file (that’s why I made the radio buttons display:none, so don’t wonder why they’re not shown). The script works by changing the label class from “off” to “on” when the radio button is checked, and back to “off” when another one is checked. But when implemented in the sidebar, it seems the label classes are not changed upon clicking, so my conclusion would be the problem is the third script.

The CSS looks like this: https://pastebin.com/f39b6fb07
The actual form looks like this: https://pastebin.com/f4ed92849
The form implemented in the sidebar (i.e. not displaying properly): https://the-fruit-stand.bplaced.net/tfs/ (“repaints search” section)

Any idea what might be wrong? I already concluded it’s not a CSS hierarchy problem (turned of the theme’s style.css, to no avail).
Many thanks in advance.

Edit: WP version is 2.8.6, not 2.8.5 – I must have misclicked.