Adding click event to on the fly generated input
Hello
I'm trying to add an event to a 'on the fly' generated input radio buttons. I've tried several ways (commented) but none works.
What i m doing wrong?
as i m not a coder at all, is my code can be improved?
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"
- type="text/javascript" charset="utf-8"></script>-->
- <script type="text/javascript" src="jquery.min.js"></script>
- <script type="text/javascript">
- addQuestions('000','#questions');
- <!--this don't work
- $('div#questions').click(
- function(e){
- if ($(e.target).is('input[value="Yes"]')) {
- addQuestions($(this).attr('id'), 'Q_' + $(this).attr('id'))
- }
- });
- -->
- function addQuestions(questionParent, parentElementId){
- $.ajax({
- type: 'GET',
- url: 'questions.xml',
- dataType: 'xml',
- success: function(xml){
- $(xml).find('question').each(function(){
- if ($(this).find('parent').text() === questionParent){
- var id = $(this).attr('id');
- var question = $('<p />').append('Q'+ id + ': ' + $(this).find('entitled').text());
- var tooltip = $(this).find('text').text();
- var questionElement = $('<div />');
- questionElement
- .attr('id','Q_' + id)
- .addClass("question")
- <!-- this don't work also
- .click(function(){addQuestions($(this).attr('id'), 'Q_' + $(this).attr('id'))})
- -->
- .append(question)
- .append(radioButton(id, 'Yes', 'Oui'))
- .append(radioLabel(id, 'Yes', 'Oui'))
- .append(radioButton(id, 'No', 'Non', true))
- .append(radioLabel(id, 'No', 'Non'))
- .append(radioButton(id, 'Unknown', 'Je ne sais pas'))
- .append(radioLabel(id,'Unknown', 'Je ne sais pas'));
- $(parentElementId).append(questionElement);
- }});},
- error: function(e){
- alert("erreur:" + e)
- }});}
- function radioButton(radioId, radioValue, radioLabel, radioChecked){
- <!-- code to create radio button-->
- }
- function radioLabel(radioIdLb, radioValueLb,radioLabelLb){
- <!-- code to create label for radio button-->
- }
</script>
</head>
<body>
<div id="questions">
</div>
</body>
</html>