[jQuery] Iterate through elements of a given class and multiply
I would like to use JQuery to iterate through a set of <div> elements
that have the same class and scale each value according to a value
selected from a dropdown box. For example,
<select id="factor">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div class="num">100</div>
<div class="num">1000</div>
<div class="num">10000</div>
If "2" was the scaling factor chosen, then the divs would look like:
<div class="num">200</div>
<div class="num">2000</div>
<div class="num">20000</div>
This is the jQuery script that attempts to do the iteration and
scaling, but I keep get NaNs. I suspect it has something to do with
my use of the .each iterator or the $(this) notation, but have not
been able to solve it.
<script>
$("#factor").change(function(){
$(".num").each(function(){
$(this).html(parseFloat($(this).val()) * parseFloat(jQuery
("#factor").val()));
});
});
</script>