Question

I’m new to HTML and jQuery and need some help….

Here’s my HTML:

<div class="conteiner">
    <div class="calendar" style=""> </div>
    <div class="status"></div>
    <div class="avatar read"></div>
    <div class="text">
        <div class="activity mytivits-act"></div>
        <div class="comments"></div>
        <div class="text-conteiner">
            <h3>test remind</h3>
            <span class="grey"></span>
            <span class="send-reminder">Remind</span>
       </div>
    </div>
</div>

I’m trying to filter out clicks from the .live function below when user is clicking on Remind link (as I have a separate function to handle this case)

<span class="send-reminder">Remind</span>

using this jQuery line below but it doesn’t work…any idea how to fix it?

$('.text-conteiner:not(.send-reminder)').live('click', function(e){
    ...
}));

Answer 1

I think you can stop the event propagation. :not() will not work here.

$('.text-conteiner').live('click', function(e){
    e.stopPropagation();
    // your code
});

DEMO

for example, you can also do like below:

$('.text-conteiner').live('click', function(e){
    alert('container');
});
$('.send-reminder').click(function(e) {
    e.stopPropagation();
    alert('remainder');
})

DEMO
​

Note

If it’s possible then instead of .live() use .on() for delegate event handling with jQuery 1.7+.