1

Good day, I want to attach click method to div, by BIND method. My code of attaching is

$("#brend_list > #mCSB_1 > .mCSB_container > div > a").bind('click',function(){
id=$(this).attr('id');
ttl=$(this).parent().children("span").html();
state=$(this).hasClass("checked");

if(state) {$(this).removeClass("checked");
$("#"+id+"_filter").remove();
}
else{$(this).addClass("checked");


$("#filters").append(" <div style='display:inline-block;' id='"+id+"_filter' class='filter_brands' onclick='brend_uncheck(\""+id+"\"); $(this).remove();'><span>"+ttl+"</span><b>x</b></div> ");


}});

My div structure is

<div id="brend_list" class="mCustomScrollbar _mCS_1">
  <div class="mCustomScrollBox mCS-light" id="mCSB_1" style="position:relative; height:100%; overflow:hidden; max-width:100%;">
   <div class="mCSB_container" style="position: relative; top: 0px;">
    <div><a id="filt_brend001"></a><span>Loreal Paris</span></div><!-- this <a> -->
    <div><a id="filt_brend002"></a><span>Laura Mercier</span></div>
    ...........
    </div>
    <div class="mCSB_scrollTools" style="position: absolute; display: block;">
      <div class="mCSB_draggerContainer"><div class="mCSB_dragger" style="position: absolute; height: 110px; top: 0px;" oncontextmenu="return false;">
        <div class="mCSB_dragger_bar" style="position: relative; line-height: 110px;">  
        </div>
      </div>
      <div class="mCSB_draggerRail">
      </div>
     </div>
    </div>
   </div>
</div>

But it doesn't attach.

4
  • Is your code in a $(document).ready event?
    – Daedalus
    Mar 31, 2013 at 6:39
  • 4
    You're binding the handler to the A inside the DIV. But there's no text in the A, so there's nothing to click on.
    – Barmar
    Mar 31, 2013 at 6:40
  • there is an image on BG of a, so there is something on click. Before some changes, it worked, but then I add some divs for scrolling, and it crashed Mar 31, 2013 at 6:54
  • You want to attach a click event to div with class filter_brands?
    – palaѕн
    Mar 31, 2013 at 8:53

1 Answer 1

2

You should either change

$("#brend_list > #mCSB_1 > .mCSB_container > div > a")

to

$("#brend_list > #mCSB_1 > .mCSB_container > div > a + span")

A fiddle with above is here.

or, change the HTML from

<div><a id="filt_brend001"></a><span>Loreal Paris</span></div>

to

<div><a id="filt_brend001"><span>Loreal Paris</span></a></div>

Fiddle with above in action is here.

2

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.