How to remove style one click event?

How can i remove the style class applied to a textbox on the click event? I'm calling the textbox element using getElementsByName(). Here's my code:

<input id="userNameExists" name="popUpText" class="pop-upText" onclick="clearText(this);" />

function clearText(element)
{
                id = element.getAttribute("id");
                var textElement = document.getElementById(id);
                textElement.value = "";
                var element = document.getElementsByName("popUpText");
                var count = 0;
                for (count = 0; count < 2; count++) {
                    var id = element.item(count)开发者_开发百科;
                    id.classname = "";
                }
}

In the above script, im not getting the id in the variable id. Right now the values are like "#inputTextBoxName". Please help.

you can use removeClass();

you can manege your styling using attr();

exp:

$("#yourid").attr("style","float: right");

or remove class using

$("#yourid").removeClass("yourClass");

It is case sensitive so

id.className = '';

If you're trying to remove the class from the textbox when you click on the textbox itself, that code is far, far longer than it needs to be.

HTML:

<input type="text" id="userNameExists" name="popUpText" class="pop-upText" onclick="clearText(this);" /> 

Javascript:

<script>
function clearText(element) {
    element.className = '';
    element.value = '';
}
</script>

That said, inline event handlers (ie. declaring an onclick attribute on your HTML element) are a bad practice to get into.

Also, if you pass in a reference to an element, get its id, then call document.getElementById() with said id, you end up with two references to the same element. Yes, it should work, but totally pointless.