Question: I'm trying to get the sum of all div's width on the page and show it on click in alert

The problem I'm facing is when I click on the button again to show the sum the result return double and if I click again for the third time, result return tripled and so on

My code in jsfiddle <http://jsfiddle.net/Jim_Toth/enypx/>

HTML

```
<button>Size of all divs?</button><br>
<div style="width: 100px;">REMOVE</div>
<div style="width: 150px;">REMOVE</div>
<div style="width: 200px;">REMOVE</div>
<div style="width: 150px;">REMOVE</div>
<div style="width: 100px;">REMOVE</div>

```

jQuery

```
var divs = 0;
$('button').click(function () {
    $('div').each(function () {
        divs += $(this).outerWidth(true);
    });
    alert(divs + 'px');
});

$('div').click(function () {
    $(this).remove();
});

```

Answer: 
Inside the click handler you need to reset the value of `divs` variable... also it can be a local variable

In your case the `divs` is a global variable whose initial value is `0`, when you click the button first time it is updated to value `x` - now the value of the shared variable is `x`. Now when you click the button again instead of starting with the value `0` the variable value is started from `x`.

```
$('button').click(function () {
    var divs = 0;
    $('div').each(function () {
        divs += $(this).outerWidth(true);
    });
    alert(divs + 'px');
});

```

Demo: [Fiddle](http://jsfiddle.net/arunpjohny/jcNUy/)
try this:

using outerWidth that provides extra padding etc

```
  $(selector).outerWidth(true) ;

```

[Demo](http://jsfiddle.net/harpreet0103/2b3sN/)

you can use width() for the div widths u provided

[Demo](http://jsfiddle.net/harpreet0103/2b3sN/1/)