Remove specific inline style with jquery

Question

There is an asp menu that I'm using is auto inserting style = "width: 3px;" to my tds menu item, creating an unpleasant gap between my tabs. I am testing to remove this inline style using jquery instead of our developer customizing the menu just for this cosmetic defect.

below is a simple example:

<table border="1" cellspacing="0" cellpadding="0">
   <tr>
      <td style="width:3px;">hello world</td>
   </tr>
</table>

in jquery, I can remove all tds with the style attribute by doing:

$('td').removeAttr('style');

So my question is how to target inline style containing only 3px?

Here's my live demo: http://jsfiddle.net/n9upF/

Answer 1

, td, , width:3px; , ?

.

$("td[style='width:3px;']").removeAttr("style");​

Answer 2

, : 3px; , css . , :

$('td').each(function(){
  if ($(this).attr('style').indexOf('3px') !== -1){
    var style = $(this).attr('style');
      $(this).attr('style', style.replace(/width: ?3px;/g, ''));
  }
});

, , Sarfraz .:)

Answer 3

So my question is, how can I only specify an inline style containing only 3px?

Try the following:

$('td').each(function(){
  if ($(this).attr('style').indexOf('3px') !== -1){
    $(this).removeAttr('style');
  }
});

See working example.