2番目のボタンはjqueryを実行できません。CSS

Question

2つのライブイベントで、ユーザーが.paddまたは.paddcのボタンをクリックしても背景色を変更する必要があります。最初のボタンは機能していますが、背景は変更できますが、2番目のボタンは変更できません。 jQueryのコードで何が間違っていますか？

<a id="hms" href="1" onClick="adduser('1'); return false;"><img id="t1" class="padd" src="tta/addr.png"></a> 
    <a id="hms2" href="2" onClick="validateuser('2'); return false;"><img id="te2" class="paddc" src="tta/addr.png"></a> 


$(document).ready(function(){ 
    var ffd = "0"; 
    $(".padd").live('click',function(event){ 
     //update profile - remove pending 
     $.ajax({ 
      type: "POST", 
      cache: "false", 
      url: "pendingupd.php?pid="+event.target.id, 
      success: function(aaa) { 
      var ttf= "#t" + event.target.id; 
       if(aaa=="Approved"){ 
        $(ttf).css("background","url('tta/pass.png') 50% 50px no-repeat"); 
        $(ttf).css("background-color","#ffffda"); 
       } else { 
        $(ttf).css("background","none"); 
        $(ttf).css("background-color","none"); 
       } 
       if(aaa=="Error"){ 
        $(ttf).css("background-color","#f0b7b7"); 
       } 
      } 
     }); 
    }); 
    $(".paddc").live('click',function(event2){ 
     //update profile - remove pending 
     $.ajax({ 
      type: "POST", 
      cache: "false", 
      url: "pendingupd.php?pid="+event2.target.id, 
      success: function(aaa2) { 
      var ttf2= "#te" + event2.target.id; 
       if(aaa2=="Approved"){ 
        $(ttf2).css("background","url('tta/pass.png') 50% 50px no-repeat"); 
        $(ttf2).css("background-color","#ffffda"); 
       } else { 
        $(ttf2).css("background","none"); 
        $(ttf2).css("background-color","none"); 
       } 
       if(aaa2=="Error"){ 
        $(ttf2).css("background-color","#f0b7b7"); 
       } 
      } 
     }); 
    }); 
}); 

Answer 1

二つの関数の唯一の違いは、第二は、この問題は、DOMにおそらくあると信じて私をリードvar ttf2= "#te" + event2.target.id;を有している第一の機能はvar ttf= "#t" + event.target.id;を持っているということです。すべてが正しいIDを持っていると確信していますか？それらは本当に異なっているはずですか？

いずれかの方法で、そのコードの短いバージョンは次のようになります。

$(document).ready(function(){ 
    var ffd = "0"; 
    // jQuery lets you select more than one element. 
    // combining them makes what you intend more obvious. 
    // and it means you create fewer functions. 
    $(".padd, .paddc").live('click',function(event){ 
     var ttf= $(this).hasClass(".paddc")? "#t": "#te" ; 
     //update profile - remove pending 
     $.ajax({ 
      type: "POST", 
      cache: "false", 
      url: "pendingupd.php?pid="+event.target.id, 
      success: function(aaa) {  
       // replace this with ttf = "#t" if te was a typo. 
       updatePendingState(aaa, ttf + event.target.id); 
      } 
     }); 
    }); 
}); 
// there is no point in having this as something created 
// EVERY time that an AJAX call is made (the old way). 
function updatePendingState(aaa, selector) 
{ 
    // initialize values to defaults. 
    var bgColor = "none", bgImg = "none"; 
    if(aaa=="Approved"){ 
     // update if a change is merited. 
     bgColor = "url('tta/pass.png') 50% 50px no-repeat"; 
     bgImg = "background-color","#ffffda"; 
    } else if(aaa=="Error"){ 
     bgColor = "#f0b7b7"; 
    } 
    // grab the value once and use it multiple times. Why wast function calls? 
    var ttf = $(selector); 
    ttf.css("background",bgImg); 
    ttf.css("background-color",bgColor); 
}