Link to home
Start Free TrialLog in
Avatar of maqskywalker
maqskywalker

asked on

javascript button click

I'm transferring this fiddle to a regular html page.

http://jsfiddle.net/cd0meuva/

The fiddle works just fine.

This is my code for my html page but when i click on the buttons on my html page they don't work.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    

    <style type="text/css">

        .content { display:none; }
        .displayed { display:block; }

    </style>

    <script type="text/javascript">

        $('#buttons button').click(function () {
            $('.displayed').removeClass('displayed');
            var div = $(this).data('div');
            $(div).addClass('displayed');
        });

    </script>



</head>
<body>

<div id="buttons">
   <button data-div="#div1">Button 1</button>
   <button data-div="#div2">Button 2</button>
   <button data-div="#div3">Button 3</button>
</div>

<div class="content" id="div1">This is div 1</div>
<div class="content" id="div2">This is div 2</div>
<div class="content" id="div3">This is div 3</div>

</body>
</html>

Open in new window


My html page buttons should work just like the fiddle above.

Anyone know what i'm doing wrong?
ASKER CERTIFIED SOLUTION
Avatar of Randy Downs
Randy Downs
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial