I'm experiencing an issue with my web-page where two buttons at the top are not responding to a sorting function on the nested #byFilter. Despite trying to apply the onclick(function()) method, it doesn't seem to work.
Javascript
$(document).ready(function() {
$('.filter').click(function() {
console.log('I\'ve gotten');
});
$('#byName').click(function(e) {
e.stopPropagation();
console.log('this far');
});
//some geolocation related code
getLocation().done(function() {
getStuff(origin);
});
});
HTML
<section id="Sortby">
<div class="filter" id="#byName">
Name
</div>
<div class="filter" id="#byDistance">
Distance
</div>
<br style="clear:both;">
Despite clicking on the divs upon loading the page, only "I've gotten" is displayed.
I cannot figure out why I am unable to attach a click listener to a nested div like this. It seems like there might be a simple step that I am overlooking.