Question

Please help me to fix this…

i have a link with the code http://jsfiddle.net/LTYa2/14/ its working fine in jsfiddle… but if i put the same thing in localhost its not working any specific reason?i also checked javascripts and jquery everything is embeded correctly(other jsfiddle code works fine)……

can anyone guide me on how to place this code

$('q.clickMe1').click(function () {
// find first of following DIV siblings
// with class "textBox" and toggle it

$(this).nextAll('div.sri1:first').show();
$('div.sri1:visible').not($(this).nextAll('div.sri1:first')).toggle();
});

html code

<q class="clickMe1">Hire</q>
<br />
<div class="sri1"> - This text will be toggled</div>

 <q class="clickMe1">Manage</q>
 <br />
 <div class="sri1"> - This text will be toggled 2</div>

Answer 1

jsFiddle is wrapping the code in onload by default that’s why it’s working. Here is fiddle where it’s not working since I disabled the onload wrapping.

To make it work for you, wrap it like this:

$(document).ready(function() {
    $('q.clickMe1').click(function () {
        // find first of following DIV siblings
        // with class "textBox" and toggle it
        $(this).nextAll('div.sri1:first').show();
        $('div.sri1:visible').not($(this).nextAll('div.sri1:first')).toggle();
    });
});

Assuming you are using jQuery 1.7 or above, you can avoid this wrapping and use .on() instead like this:

$(document).on('click', 'q.clickMe1', function () {
    //...your code here
});

Updated fiddle – no onload and still working.