如何使用jQuery在DOM中的其他地方添加一個類？

Question

如何在div下一個input[bdate]下一個添加.jokjok類？

例子：http://jsfiddle.net/cLNJE/1/

此代碼並沒有爲我工作：

<button>Click Me</button> 
<div class="pa_row mediumCell"> 
    <div class="column"> 
     <input type="text" name="expass"> 
    </div> 
    <div class="column"> 
     <div class="auto_box2"> 
      <input type="text" name="bdate"> 
      <div></div> 
     </div> 
    </div> 
    <div class="column"> 
     <input type="text" name="old"> 
    </div> 
</div> 



$('button').live("click", function() { 
    $('input[bdate]').closest('.pa_row ').find('auto_box2 div').removeClass().addClass('jokjok'); 
    //alert('click is ok') 
}); 

Answer 1

我認爲你需要指定要使用正確的輸入選擇哪個屬性：

$('input[name="bdate"]'); 

這對我有效：

$('button').live("click", function() { 
    $('input[name="bdate"]').closest('.pa_row').find('div.column div.auto_box2 div').first().removeClass().addClass('jokjok'); 
}); 

參見：http://jsfiddle.net/cLNJE/7/

Answer 2

的簡單的方法是： 添加ID attribut到div的

<div id="someid"></div> 
$('button').live("click", function() { 
    $('#someid').addClass('jokjok'); 
}); 

或者

創建新的整體格

$('button').live("click", function() { 
     $('input[name="bdate"]').after('<div class="jokjok"></div>'); 
    }); 

Answer 3

一些你選擇的不太對，

$('input[bdate]') 

應該

$('input[name=bdate]') 

這將選擇「bdate」你以前選擇的名稱屬性輸入被選擇的是有「bdate」

find('auto_box2 div') 

的屬性所有輸入

應該是

find('div.auto_box2') 

這個w生病選擇了一類「auto_box2」

使這些變化給我們留下了這段代碼的「格」 -

$('button').live("click", function() { 
    $('input[name=bdate]').closest('.pa_row ').find('div.auto_box2').removeClass().addClass('jokjok'); 
    alert('click is ok') 
}); 

你想要什麼應該做的希望。

更新後的小提琴 - 的[添加使用JQuery CSS類] http://jsfiddle.net/ipr101/542ZW/1/

Answer 4

http://jsfiddle.net/cLNJE/8/

$('button').live("click", function() { 
    $('.auto_box2 input').siblings('div').addClass('jokjok'); 
});