title: jQuery find elements with variable class names using regex?
body: <p>I am trying to get the number of elements that have a certain class name in them, the problem is, this class name has a variable at the end of it.  For example:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col"&gt;
  
      &lt;/div&gt;
      &lt;div class="col width-33"&gt;
  
      &lt;/div&gt;
      &lt;div class="col"&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have been trying to write a jquery script to get the number of different <code>col</code>s there are and to get the number of columns with a class name of <code>width-xx</code> where XX can be any number. </p>
  
  <pre><code>$('.col').parent().each(function(i){ //The container could be anything
      var numCols = $(this).children('.col').length;
      var numColsWidth = $(this).children('div[class^="width-"].col').length;
      console.log(numCols, numColsWidth);
  });
  </code></pre>
  
  <p>I'd like to output to be <code>3 1</code>, showing there are 3 total columns and 1 of them has a class named width-xx.  </p>
  
  <p>Just as the example above shows, I've tried using the CSS selector, but that doesn't give me anything (outputs <code>3 0</code>)</p>
  
  <p>I've also tried playing around with RegExp, but I'm not sure how to add this into that </p>
  
  <pre><code>var widthClass = new RegExp("width-");
  if(widthClass.test($('.col').attr('class'))){
      //do something
  }
  </code></pre>
  
  <p>So, all I would like to do is count the number of elements that contain the word "width-" in the class.</p>