CODEWITHSUNDEEP
javascriptjqueryhtml
QuackZilla
QuackZilla

Reputation: 55

How to change content in div on click?

Trying to change some content in divs on click. Found one solution, but it works only with ID. Change content of only one div. How to fix it? 

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

Here is Jsfiddle

UPDATE. Edited Jsfiddle a little bit. Here is picture:

enter image description here

Upvotes: 0

Views: 1716

Answers (2)

Airrudi
Airrudi

Reputation: 86

Not sure if I understand you correctly, but if you want to change the content of multiple div's, you can do it like this:

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

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

Can you elaborate a bit more on your question if this is not what you are looking for?

Upvotes: 1

Amresh Venugopal
Amresh Venugopal

Reputation: 9549

You can get the first div by using :nth-child:() selector. Read about this 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");
  });
});

Upvotes: 1

Related Questions