Uncaught TypeError: Object #<HTMLDivElement> has no method 'height' - Can't call jquery method on element

Question

I would need to loop within some html elements, using the same code I get an error

jquery Uncaught TypeError: Object # has no method 'height'

What is wrong here?

clamp: function() {
  var elms = $('#wrapper .content ul li .title');
  elms.each(function(i) {
    debugger
    var elm = this;
    var h = elm.height();
    var eO = elm.outerHeight();
    if (eO > h) {
      elm.text(function(index, text) {
        return text.replace(/\W*\s(\S)*$/, '...');
      });
    }
  })

Answer 1

In your each() method, this refers to the DOM element, not a jQuery object (hence you can't call jQuery methods on it). Instead of

elm = this

Try

elm = $(this)

Answer 2

You need to wrap the DOM element (this) into a jQuery object:

var elm = $(this);

See the docs of the .each() function:

More importantly, the callback is fired in the context of the current DOM element, so the keyword this refers to the element.