如何将addClass添加到多个元素？

Question

我正在使用这个javascript来为多个元素添加一个类.我试图引用多个div和addClass.它只适用于第一个.

使用Javascript

<script>            
            $(function(){           
            if ( $(window).width() < 230 ) {
              $('#item1').addClass('col1'); //max-width 80px

            }
            else 
                if ( $(window).width() >= 230 && $(window).width() < 330 ) {
              $('#item1').addClass('col2'); //max-width 180px

            }
            else 
           {
              $('#item1').addClass('col3'); //max-width 280px

            }

          });
        </script>

如果我在页面上只有一个#item1但它似乎不想将类添加到同一div id中存在的多个项目,那么它正在工作.我甚至尝试将类添加到同一div类中存在的多个项而不是id.如果你能弄明白的话,任何一个都是mw的好解决方案.

我的HTML代码是

    <div id="item1" class="blue">
<label for="amount">Price range:</label>
<input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
<div class="slider-range"></div>
</div>

<div id="item1" class="blue">
<label for="amount2">Price range:</label>
<input type="text" id="amount2" style="border:0; color:#f6931f; font-weight:bold;"/>
<div class="slider-range2"></div>
</div>

一直试图弄清楚这几个小时,所以我想我会问是否有人可以指出我正确的方向.提前致谢.

Answer 1

ID应该是唯一的.尝试添加一个类,比如"item":

<div class="blue item">
    ...etc...
</div>

然后在你的JS中:

$('.item').addClass('col1');