Add button dynamically (jquery)

Question

I want to make pagination with jquery and Ajax. The first where I'm stumbling on is how I can add a button

<div class="btn-group" id="pagination_group">
        <button class="btn" disabled="disabled">First</button>
        <button class="btn" disabled="disabled">Prev</button>
        <button class="btn btn-primary" id="p1">1</button>
        <button class="btn" id="p2">2</button>
        <button class="btn" id="p3">3</button>
        <button class="btn" id="p4">4</button>
        <button class="btn" id="p5">5</button>
        <button class="btn" id="next">Next</button>
        <button class="btn" id="last">Last</button>
    </div>

Something with append()? But how to get it it the right place? The idea is after click on Next remove btn with id="p1" ( that's no problem) and add button with id="p6" between button5 and button Next.

Thank you for your advice.

Rajat Singhal · Accepted Answer · 2012-10-06 18:33:23Z

2

$("#next").click(function(){
    $("#p1").remove();
    $("#next").before($('<button class="btn" id="p6">6</button>'));
})

answered Oct 6, 2012 at 18:33

Rajat Singhal

11.3k5 gold badges40 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Okan Kocyigit Over a year ago

I think you may remove the button that is after prev-button, because there won't be a "#p1" element for second time of clicking next button.

Rajat Singhal Over a year ago

yeah, but I just answered wat was exectly asked for..I know this is not gonna work in general..cuz in that case he needs to change p6 and p1 info with preper variables..

krg · Accepted Answer · 2012-10-06 19:05:25Z

0

Possibly several ways to accomplish this. See this working example

edited Oct 6, 2012 at 19:05

answered Oct 6, 2012 at 18:45

krg

2,8202 gold badges15 silver badges9 bronze badges

1 Comment

Alexander P Over a year ago

Thank you. It is complete solution (at least what I nedeed for the moment).

Collectives™ on Stack Overflow

Add button dynamically (jquery)

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related