jQuery Qtip inheritance

I have used the jQuery Qtip plugin to create some tooltips using the following code:

$('*[title]').each(function() {
        //i开发者_StackOverflow社区f ($(this).attr('title') != "") {
        $(this).qtip({
            content: $(this).attr('title'),
            position: {
                target: 'mouse',
                adjust: {
                    screen: true,
                    x: 5,
                    y: 15
                },
                corner: {
                    target: 'rightMiddle',
                    tooltip: 'leftMiddle'
                }
            },
            style: {
                fontSize: 11,
                padding: '2px 6px',
                textAlign: 'left',
                lineHeight: 1.5,
                fontWeight: 'bold',
                color: '#444',
                border: {
                    width: 1,
                    radius: 2
                },
                name: 'cream'
            }
        })
           .attr('title', '');
        // }
    });


    $('span.help').each(function () {
        $(this).qtip({
            /*content: {
            text: $(this).html()
            },*/
            content: $(this).attr('title'),
            position: {
                adjust: {
                    screen: false,
                    x: 0,
                    y: 0
                },
                corner: {
                    target: 'topRight',
                    tooltip: 'bottomRight'
                }
            },
            show: 'mouseover',
            hide: 'mouseout',
            style: {
                title: { 'font-size': 11, padding: '6px 6px', lineHeight: 1.5 },
                fontSize: 11,
                padding: '6px 6px',
                textAlign: 'left',
                lineHeight: 1.5,
                fontWeight: '600',
                border: {
                    width: 3,
                    radius: 3
                },
                tip: 'bottomRight',
                name: 'cream'
            }
        })
   .attr('title', '');
    });

Basically all elements with a title have a tooltip BUT I want elements with the class of help to have a special tooltip. What happens is that I get TWO tooltips for the help element. Is it possible to override the first one with the second completely?

Perhaps using some sort of if statement to check first that it's NOT the help class if not then do the first function and if so then do the second function.

Thanks

Have you tried just adding a :not() clause to your first select to exclude the help spans?:

 $('*[title]:not(span.help)').each(function() {

EDIT :

var title = $(this).attr('title'),
    help = $(this).attr('class'),
    isHelp = undefined;

if(help !== undefined){
    var isHelp = help.search('help');
}


if(title !== undefined){


    if((title.length !== 0)&&((isHelp == -1)||(isHelp == undefined))){

        alert('do title tiptool function');

    }

}

Example : http://jsfiddle.net/ZqLH6/6/

You can have a selector like $("[title], .help") which selects all elements you want to give a tooltip. Then, inside the each anonymous function, use $(this).hasClass("help") to determine which tooltip you want to give that element.