Question

I have some buttons that has a class name NextButton on my document. There can be one or more nextbutton in the document at the same time. But their widths are different as below

<input type="button" class="NextButton grid3" value="Continue" />

<input type="button" class="NextButton grid14" value="TestTest TestTest" />

.

    $('input[type=button].NextButton')
    .wrap('<div class="NextButton" />') 
    .parent()       
    .css('width',$('input[type=button].NextButton').outerWidth() + 'px')

The question is How can I get the width of button element. This code is looking all of the element that has a class nextbutton. I want the with of ‘this’. Because as you will see in the live example, I want the red part always right of the button and one more problem is that it is not clickable . I want also that red part can be clicked.

.css('width',$('input[type=button].NextButton').outerWidth() + 'px')

Thanks in advance,

Live example
http://jsfiddle.net/NZF7W/

Answer 1

try to use

 $(slector).each(function(i,e){
$(e).dostuff() <-- here is the current element and this will aplly to each element
$(e).css('width'); <-- will return the width of the current elem
});