Question

HTML looks like

<td>
    <input type="text" onkeydown="" style="" value="" id="v65-onepage-billlastname" name="BillingLastName" maxlength="50" size="25" class="co-text">
</td>

My CSS Class (please note i can’t change the .CSS file as its called remotely from some other server)

#v65-onepage-billfirstname, #v65-onepage-billlastname, #v65-onepage-billcompanyname, #v65-onepage-billaddr1, #v65-onepage-billaddr2, #v65-onepage-billcity, #v65-cart-billemail, #v65-onepage-shipfirstname, #v65-onepage-shiplastname, #v65-onepage-shipcompanyname, #v65-onepage-shipaddr1, #v65-onepage-shipaddr2, #v65-onepage-shipcity {
    width: 280px !important;
}

To override the CSS and change the width of v65-onepage-billlastname to 150px using Jquery what is the method used

Answer 1

without mixing javascript and css, just define two CSS rules

#v65-onepage-billfirstname { width: 280px !important }
#v65-onepage-billfirstname.afterJSExecution { width: 150px !important }

and add a class like so

$('#v65-onepage-billfirstname').addClass('afterJSExecution');

example fiddle: http://jsfiddle.net/JQtmt/