title: Apply JavaScript function to multiple elements
body: <p>So I'm building a moch website and I'm adding a image zooming thingy with CSS3 and JavaScript, so first here is my code.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;img id="img" onclick="image()" class="contentimgleft" src="test.jpg"&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.contentimgleft {
      float: left;
      margin: 5px 5px 5px 10px;
      background-color: #888888;
      width: 25%;
      height: 25%;
      -webkit-transition: all .4s linear;
      -moz-transition: all .4s linear;
      -o-transition: all .4s linear;
      -ms-transition: all .4s linear;
      transition: all .4s linear;
  }
  .contentimgleftl {
      float: left;
      margin: 5px 5px 5px 10px;
      background-color: #888888;
      width: 97%;
      height: 98%;
      -webkit-transition: all .4s linear;
      -moz-transition: all .4s linear;
      -o-transition: all .4s linear;
      -ms-transition: all .4s linear;
      transition: all .4s linear;
  }
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>function image() {
      if (document.getElementById("img").className.match(/(?:^|\s)contentimgleft(?!\S)/) ) {
          document.getElementById("img").className="contentimgleftl";
      } else {
          document.getElementById("img").className="contentimgleft";
      }
  }
  </code></pre>
  
  <p>Now this works perfectly, until you have more than one image. So what I'm looking for is a better system that achieves the same results. I've tried a couple of things but it keeps coming back to having JavaScript code that works for all the images but zooms each one individually.</p>
  
  <p><code>.contentimgleft</code> and <code>.contentimgleftl</code> are the same except for the <code>width</code> and <code>height</code>. So I'm hoping there is some way to just change these two styles to individual images with the same JavaScript code?</p>
  
  <p>Also note that the is a class for right floated images as well but I omitted them for simplicity as they are exactly the same.</p>
  
  <p>I tried making a jsfiddle but it didn't like the <code>(/(?:^|\s)</code> bit for some reason.</p>