如何更改不同子類的彈出窗口的寬度？

Question

<span class="grandparent"> 
     <span class='parent'> 
      <span id="popUP" class="child1"> 
       Some content for popUP 
      </span> <!-- 1st child has width of 390px--> 
     </span>  
    </span> 

現在對於不同的選項，比如說下面提到的子標籤被替換爲新的標籤。

 option A) <span id="popUP" class="child2"></span> 
      <!-- 2nd child has popUP width of 550px--> 
    option B) <span id="popUP" class="child3"></span> 
      <!-- 3rd child has popUP width of 450px--> 
    option C) <span id="popUP" class="child4"></span> 
       <!-- 4th child has popUP width of 350px--> 

如何使用JavaScript或jQuery動態更改彈出窗口的寬度？我嘗試使用.find()方法，但它沒有運氣

Answer 1

你不應該這樣做嗎？你的id和class是相反的。

option A) <span class="popUP" id="child2"></span> 
      <!-- 2nd child has popUP width of 550px--> 
option B) <span class="popUP" id="child3"></span> 
      <!-- 3rd child has popUP width of 450px--> 
option C) <span class="popUP" id="child4"></span> 
       <!-- 4th child has popUP width of 350px--> 

然後做這樣的事情？

$("#child2").addClass("width2"); 

那麼CSS

.width2 
{ 
width:550px; 
} 

考慮使用DIV。我讀過的地方忽略標籤。併發布整個代碼可能會有所幫助。