How to add styles to a button that is created when clicking another button?

Question

I have this button that is loaded whenever u click another button(so its not loaded on startup without me doing anything)

<button type='button' id='testbtn' 
onclick='testfunction()' onload='testload()' 
class='testbtnclass'>btn</button>

This is my function:

 function testload() {

alert("onload worked");
 /*what i want to archieve within this function later is to change the
 css of the button but for now i just want to call this function onload of 
 the button, which it doesnt/*
}

My question is now, how can i/should i do to get this function to run whenever this button is loaded?

So you have btnA, when you click on it it generates btnB, and then you want to fire an event when you created btnB? — Kiss Koppány
– Kiss Koppány, Commented Apr 30, 2015 at 8:39

NullPoiиteя · Accepted Answer · 2015-04-30 08:43:33Z

1

onload is not supported by button tag so you need to do it either as other answer telling or with

document.onload =function(){

  //change the css of that button or call function you want 

}

answered Apr 30, 2015 at 8:43

NullPoiиteя

57.3k23 gold badges130 silver badges148 bronze badges

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

Comments

yahya el fakir · Accepted Answer · 2015-04-30 08:39:50Z

1

I believe you can create a css class example:

.buttonStyle{ background-color: red };

Then you can get your button and add this class

var button = document.getElementById("testbtn");
button.className = button.className + " buttonStyle";

answered Apr 30, 2015 at 8:39

yahya el fakir

5622 silver badges13 bronze badges

Comments

keno · Accepted Answer · 2015-04-30 08:42:32Z

0

using jQuery you can do just the following:

$( "button" ).addClass( "myClass yourClass" );

answered Apr 30, 2015 at 8:42

keno

931 silver badge11 bronze badges

Comments

Kiss Koppány · Accepted Answer · 2015-04-30 08:44:01Z

0

You could use event delegation of jQuery. With this technique, it doesnt matter if the button gets generated after DOM is loaded.

$('body').on('click', '.generated_btn', function() {
    //here you can change css
});

Event delegation allows us to attach a single event listener, to a parent element, that will fire for all descendants matching a selector, whether those descendants exist now or are added in the future.

More information: https://learn.jquery.com/events/event-delegation/

answered Apr 30, 2015 at 8:44

Kiss Koppány

9605 gold badges17 silver badges33 bronze badges

Collectives™ on Stack Overflow

How to add styles to a button that is created when clicking another button?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related