Search code examples
jqueryclickable

Jquery Clickable Div not working on inner div

I have this markup to make the entire div clickable. 

<div class="myBox">
<div class="two">
    <h2> Title</h2>
    <p> This is the description</p>
    <a class="some-button-class" href="http://www.google.com/">check here</a>
</div>
</div>

And this JS

 $(".myBox").click(function(){
 window.location=$(this).find("a").attr("href"); 
 return false;
});

And this css

.myBox { cursor:pointer;width:200px;height:200px;}
h2 {font-size:28px;}
p { color:#fff }

.two { 
background: #999;
padding:50px;
}

But it's not working. Why?!

JSfiddle http://jsfiddle.net/ryRnU/16/

Solution

  • Change selector from '.mybox' to '.myBox'

    $(".myBox").click(function(){
 window.location=$(this).find("a").attr("href"); 
 return false;
});

    Updated your jsFiddle (corrected typo and added jQuery which was missing in your example) -> http://jsfiddle.net/ryRnU/17/