Как использовать JavaScript для отображения div при нажатии переключателя в отдельных разделах HTML ⇐ Javascript

[Anonymous]

Я создаю сайт на WordPress, который использует плагин для пожертвований Charitable. На странице пожертвований есть два раздела с двумя наборами переключателей для значений пожертвований. В плагине нет функции, которую я хочу включить, и они не будут поддерживать функцию, которую я пытаюсь создать.
Я хочу отображать некоторый контент, когда пользователь выбирает сумму пожертвования. Я пытался использовать Code Snippets, отдельный плагин, поддерживаемый Charitable, но добился лишь ограниченного прогресса. Меня сдерживают мои ограниченные знания в области кодирования.
У меня есть два фрагмента кода: один на PHP и один на JavaScript. Фрагмент PHP добавляет пользовательский контент в нужное место, а фрагмент JavaScript управляет тем, какой div отображается при нажатии переключателя (сумма пожертвования).
Моя проблема в том, что когда я нажимаю на сумму пожертвования, он отображает содержимое только в HTML-разделе одного пожертвования, но не в HTML-разделе повторяющегося пожертвования. Я пробовал настраивать переключатели другими способами, но у меня ничего не получилось.
Фрагмент PHP
add_action('charitable_donation_form_after_donation_amounts', 'add_custom_content');
function add_custom_content(){
echo 'Single £5 is selected
Single £10 is selected
Single £25 is selected
Single £50 is selected
Single Custom amount is selected';
}

add_action('charitable_recurring_donation_form_after_donation_amounts', 'add_custom_content_rec');
function add_custom_content_rec() {
echo 'Recurring £5 is selected
Recurring £10 is selected
Recurring £25 is selected
Recurring Custom amount is selected';
}

Фрагмент JavaScript
jQuery(function ($) {
var sglAmountSection = document.getElementsByName('donation_amount');

for (var i = 0; i < sglAmountSection.length; i++) {
sglAmountSection.onclick = function() {
$(".sgl-content").css('display', 'none'); // Hide all sgl divs
$(".sgl" + this.value).css('display', 'block'); // Show the selected div
}
}
});

jQuery(function ($) {
var recAmountSection = document.getElementsByName('donation_amount');

for (var i = 0; i < recAmountSection.length; i++) {
recAmountSection.onclick = function() {
$(".rec-content").css('display', 'none'); // Hide all rec divs
$(".rec" + this.value).css('display', 'block'); // Show the selected div
}
}
});

HTML

The minimum donation for this campaign is £5.
Your Donation

• 
  One Time
• 
  Monthly

Your monthly Donation

• 
  
  £5 / month
• 
  
  £10 / month
• 
  
  £25 / month
• 
  
  
  Custom amount

Recurring £5 is selected
Recurring £10 is selected
Recurring £25 is selected
Recurring Custom amount is selected




Your One-Time Donation

• 
  
  £5
• 
  
  £10
• 
  
  £25
• 
  
  £50

• 
  
  Custom amount

Single £5 is selected
Single £10 is selected
Single £25 is selected
Single £50 is selected
Single Custom amount is selected







Подробнее здесь: https://stackoverflow.com/questions/798 ... d-on-separ