unit test case for Javascipt function which access HTML elements from FORM

I am new to JAVA script unit testing.

We are converting a PHP legacy application to Symfony2 framework. We are planning to use the legacy javascript library. The TDD approach is working for Controller and Services (PHP code).

For Javascript functions TDD is not required, as we are successfully able to use the legacy Javascript functions by making the elemenent IDs similar to the old code in new Symfony2 forms (twigs).

For future enhancement and unit testing of javascript code also, we need to write unit test cases for these legacy functions also. We are planning to use Qunit for this.

An example function is

function DetailDrop(fieldname) {
fn = fieldname.id;
var field = fn.substring(0, fn.length - 2);
if (document.getElementById(field + "_C") && document.getElementById(field + "_C").checked == true && document.getElementById(field + "_D")) {
    document.getElementById(field + "_D").style.display = 'inline';
}
else if (((document.getElementById(field + "_Y") && document.getElementById(field + "_Y").checked == true) || (document.getElementById(field + "_/") && document.getElementById(field + "_/").checked == true)) && document.getElementById(field + "_D")) {
    document.getElementById(field + "_D").style.display = 'none';
    document.getElementById(field + "_D").selectedIndex = 0;
}
else if (((document.getElementById(field + "_N") && document.getElementById(field + "_N").checked == true) || (document.getElementById(field + "_P") && document.getElementById(field + "_P").checked == true)) && document.getElementById(field + "_D")) {
    document.getElementById(field + "_D").style.display = 'inline';
}

}

Giving the problem context above, I am not able to find out a way to unit test such javascript functions, which access HTML elements from a web form.

In such a scenario should I look for options to mock the complete web form

or am I totaly out of context here?