Rehan purohit
Rehan purohit

Reputation: 45

length is not work on ajax loaded content

This is my Html

 <li><a class="tab-click" href="#tab-4" data-tab-current="about-us">About Us</a></li>

this is my jQuery code

  $(document).on('click', '.tab-click a', function(event) {
    if($('.s-tab').length)
        {
            event.preventDefault();
            $("html, body").animate({
                scrollTop: $('.tab').offset().top - 80
            }, 500);
            $('.main-tab > li').removeClass("current");
            $('[data-tab="'+$(this).attr("data-tab-current")+'"]').addClass("current");
            var tab = $(this).attr("href");
            $('.s-tab > div').not(tab).css("display", "none");
            $(tab).fadeIn();
        }
    else{

     alert('else');
    }

})

my html page content loading using ajax. when i try to find "s-tab" class on my html document then i can't find, when i check without ajax loaded content it work fine. Any help much appreciated , Thanks in advance .

Upvotes: 0

Views: 157

Answers (1)

Suresh Suthar
Suresh Suthar

Reputation: 812

Your click selector is wrong. try this below code

 $(document).on('click', '.tab-click', function(event) {
if($('.s-tab').length)
    {
        event.preventDefault();
        $("html, body").animate({
            scrollTop: $('.tab').offset().top - 80
        }, 500);
        $('.main-tab > li').removeClass("current");
        $('[data-tab="'+$(this).attr("data-tab-current")+'"]').addClass("current");
        var tab = $(this).attr("href");
        $('.s-tab > div').not(tab).css("display", "none");
        $(tab).fadeIn();
    }
else{

 alert('else');
}

})

Upvotes: 1

Related Questions