CODEWITHSUNDEEP
javascriptjqueryhtml
Spl1tz
Spl1tz

Reputation: 37

jQuery seems not work inside a function

what I try to do is an button onclick event. When you click the button the other div is sliding down. When it slides down, it also add an onclick event to the button, when you use like alert() , console.log() inside the function it works just fine. But when I use like $('#formHelper').html('New content'); nothing happens.

First, I made an jsfiddle here.

No errors or anything, the codes looks like:

<div class="panel panel-default">
    <div class="panel-heading">
    <span class="label label-primary">BOOTSTRAP</span> <b>Form-Helpers </b>
        <div class="pull-right"> 
             <button class="btn btn-primary btn-xs" id="formHelper">Show</button> 
        </div>
    </div>
<div class="panel-body" id="formHelperShow">
    Some text
</div>


function myFn(  ) {
    $('#formHelper').html('New content');
    console.log( 'works?' );
};

$(document).on('click', '.btn', function(e)
{

    e.preventDefault();
    var div = '#'+$(this).attr('id');

    $(div)
    .html('Hide')
    .removeClass('btn-primary')
    .addClass('btn-danger')
    .attr('onclick', 'myFn()');

    $(div+'Show').slideDown(500);

});

Upvotes: 0

Views: 49

Answers (1)

Sebastian Osuna
Sebastian Osuna

Reputation: 397

Should be 

$(document).on('click', '.btn', function(e)
{

    e.preventDefault();
    var div = '#'+$(this).attr('id');

    $(div)
    .html('Hide')
    .removeClass('btn-primary')
    .addClass('btn-danger')
    .attr('onclick', myFn);  // Here is the change

    $(div+'Show').slideDown(500);

});

Edit: 

function myFn() {
    $('#formHelper').html('New content')
    .unbind('click').click(frstClck);
    $('#formHelperShow').slideUp(500);
};
var frstClck = function (e) {

    e.preventDefault();


    $(this)
        .html('Hide')
        .removeClass('btn-primary')
        .addClass('btn-danger')
        .unbind('click')
        .click(myFn);

    $("#"+this.id + 'Show').slideDown(500);

}


$('.btn').click(frstClck);

Upvotes: 3

Related Questions