按钮颜色不变

Question

Problem- Button colour is not changing, I used jquery click function

<button class="red"  id="MyQuotes" href="#" title="">@Aceo.Crm.App.Resources.Shared.Order.Link_MyQuote</button>

For this button i used jquery as

$(document).ready(function(){
    $("#MyQuotes").click(function(){
    $(this).css({background:"red"});
    });
});

But it was not successfull, I tried to do this in this way too-

<button class="red" onclick="D()" id="MyQuotes" href="#" title="">@Aceo.Crm.App.Resources.Shared.Order.Link_MyQuote</button>

I made javascript function here as-

<script language="javascript">
function D()
{
document.body.style.backgroundColor="red";
}
</script>

And yes this time i was again failed. Can you please suggest me some codes?

Answer 1

Using jQuery: http://jsfiddle.net/DrWjq/

$(document).ready(function(){
   $("#MyQuotes").click(function(){
    $(this).css({background:"red"});
   });
});

Pure JS: http://jsfiddle.net/wx9tw/

function D(id)
{
 id.style.backgroundColor="red";
}

<button class="red" onclick="D(this)" id="MyQuotes" href="#" title="">@Aceo.Crm.App.Resources.Shared.Order.Link_MyQuote</button>

Answer 2

your selector's id is "MyQuotes" and not "MyOrders"

try this

$("#MyQuotes").click(function(){
  $(this).css({background:"red"});
});

OR

function D()
{
  $('#MyQuotes').css({background:"red"});
}

Answer 3

You must refer the button (SO #MyQuotes not #MyOrders) in JS:

$(document).ready(function(){
    $("#MyQuotes").click(function(){
    $(this).css({background:"red"});
    });
});

Answer 4

You can use $(this).css("background-color","red"); (and target the correct element id)

fiddle