title: attr() method trouble in jQuery
body: <p>When I try to add an attribute like id or class in html tags by using jQuery,
  then the old value of the attribute is lost.</p>
  
  <p>Here is an example:</p>
  
  <pre><code>&lt;div id="dom"&gt;
      &lt;h1 class="class"&gt;I am heading 1&lt;/h1&gt;
      &lt;h1 class="class"&gt;I am heading 2&lt;/h1&gt;
      &lt;h1 class="class"&gt;I am heading 3&lt;/h1&gt;
      &lt;h1 class="class"&gt;I am heading 4&lt;/h1&gt;
      &lt;h1 class="class"&gt;I am heading 5&lt;/h1&gt;
      &lt;h1 class="class"&gt;I am heading 6&lt;/h1&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Now I am trying to add another class by jquery which has a class named 'class'.</p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function(){
          $('.class').attr('class','newClass')
      })
  &lt;/script&gt;
  </code></pre>
  
  <p>As a result it removes the old class and set the new class. But I want both classes. What's a good way around this problem?</p>