Question

I’m trying to create a inline class that get’s element id in it’s constructor, and call immediately to sub-function of this class.

I’m getting styleit not a function: but it’s a class.

But I need it acting as function, just like jQuery does:

$('.hidden').show();

This is my code:

var styleit = function(elem) {
    this.el = document.getElementById(elem);

    this.green = function() {
        this.el.style.color = 'green';
    }

    this.red = function() {
        this.el.style.color = 'red';
    }
}

Activate like this:

<a href="#" id="theid" onclick="styleit('theid').green();">style me</a>
<a href="#" id="theid2" onclick="styleit('theid2').red();">style me</a>

Answer 1

Try something like this instead (this is how jQuery implements its $):

window.styleit = function(x) {

    return new _styleit(x);

};

jsFiddle Demo