Event isn't firing on click : <p>I have appended the following HTML to a Div called <code>videoList</code> but when I click the link it isn't firing the ajax call but it's going to the url defined in <code>href</code>. I have tried javascript void in href but still it's not firing the ajax on click. No error is present in console!</p>

<pre><code> var newHtml = '&lt;div class="group-seemore"&gt;';
                        newHtml +=    '&lt;a class="ajax-cate-mobile" data-slug="' + res.category.slug + '" data-start="5" href="/blog/category/'+ res.category.slug +'" title=""&gt;';
                        newHtml +=    'See more';
                        newHtml +=    '&lt;/a&gt;';
                        newHtml +=    '&lt;/div&gt;';
                        $('#videoList').append(newHtml);
</code></pre>

<p>Ajax:</p>

<pre><code>$('.ajax-cate-mobile').click(function(e){
            console.log('hi');
            e.preventDefault();
            var $this = $(this);
            var start = $this.parents('.blog-groups').find('.ajax-cate-mobile').data('start');
            params.start = start;
            var newStart = start + 10;
            $this.parents('.blog-groups').find('.ajax-cate-mobile').data('start', newStart);

            $(this).style="border-bottom:1px solid #197B81";
            var _loader = '&lt;div class="ajax-loader"&gt;&lt;img src="/images/ajax-loader.gif"&gt;&lt;/div&gt;';
            //$('#videoList').empty().html(_loader);
            var cate_slug = $(this).attr('data-slug');
            params.cate_slug = cate_slug;
            ajaxLoadVideoInMobile(params, $this);
            $('.submenu').fadeOut();
            $('.ajax-loader').fadeOut();
        });
</code></pre>
