Как изменить содержимое в div на клик?

Question

Попытка изменить какой-либо контент в divs при нажатии. Нашел одно решение, но оно работает только с идентификатором. Измените содержимое только одного div. Как это исправить?

$(document).ready(function() {  
$("#buttons a").click(function() { 
    var id = $(this).attr("id"); 
    $("#pages div").css("display", "none"); 
    $("#pages div#" + id + "").css("display", "block"); 
    });}); 

Вот Jsfiddle

UPDATE. Отредактировано Jsfiddle. Вот картинка:

Answer 1

Не уверен, что, если я вас правильно понимаю, но если вы хотите изменить содержание нескольких Див, вы можете сделать это следующим образом:

https://jsfiddle.net/Airrudi/mA8hj/139/

$(document).ready(function() {  
    $("button").click(function() { 
     var content = $(this).data('content'); 
     $('#pages .allowChange p').html(content); 
    });  
}); 

Можете ли вы подробнее рассказать о своем вопросе, если это не то, что вы ищете?

Answer 2

Вы можете получить первый DIV с помощью: п-го ребенка :() селектор. Читайте об этом Here

$(document).ready(function() {  
    $("#buttons a").click(function() { 
    var id = $(this).attr("id"); 
    $("#pages div:nth-child(1)").css("display", "none"); 
    $("#pages div#" + id + "").css("display", "block"); 
    }); 
});