A little help required urgently

I am creating a little template for my website but getting an error i think so in jquery actually i want to repeat the price terms toggle option multiple times on a single page e.g. 1 month 6 months 12 months term. All is ok but on 2nd tab when i select any option it comes the first group moves and merge into the second group i tried to find out but nothing works for me Here is the example og the error. Kindly help me in this
Before:


After:


Here is my code:

JS

        <script type="text/javascript">
$(document).ready(function() {
    $("div.desc").hide();
    $("div.shared-page-tables-4colmns-button").show();
    $("input[name$='sharedprices']").click(function() {
        var test = $(this).val();
        $("div.desc").hide();
        $("#initial").hide();
        $("#" + test).show();
    });
});
</script> 

Code (markup):

HTML Code:

 <div class="shared-price-change-main">
                            <ul>
                            <li><input type="radio" name="sharedprices" value="basicterm1"  /> 1 Month <b>$1.99</b>/mo</li>
                            <li><input type="radio" name="sharedprices" value="basicterm2" / 1 /> 6 Months <b>$1.99</b>/mo</li>
                            <li><input type="radio" name="sharedprices" value="basicterm3" / 1 /> 12 Months <b>$1.99</b>/mo</li>
                            </ul> 
                        </div>
                                                  <div id="myRadioGroup" class="shareddetailsplan">
                                    <div id="basicterm1" class="desc">
                                    <label>You Save 0</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://google.com">Order Now</a></div>
                                    </div>
                                    <div id="basicterm2" class="desc">
                                    <label>You Save 5%</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://msn.com">Order Now</a></div>
                                    </div>
                                    <div id="basicterm3" class="desc">
                                    <label>You Save 10%</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://msn.com">Order Now</a></div>
                                    </div>
                                    <div class="shared-page-tables-4colmns-button" id="initial"><label>You Save $0</label><a href="#">Order Now</a></div>
                        </div>





<div class="shared-price-change-main">
                            <ul>
                            <li><input type="radio" name="sharedprices" value="standardterm1"  /> 1 Month <b>$1.99</b>/mo</li>
                            <li><input type="radio" name="sharedprices" value="standardterm2" / 1 /> 6 Months <b>$1.99</b>/mo</li>
                            <li><input type="radio" name="sharedprices" value="standardterm3" / 1 /> 12 Months <b>$1.99</b>/mo</li>
                            </ul> 
                        </div>
                                                  <div id="myRadioGroup" class="shareddetailsplan">
                                    <div id="standardterm1" class="desc">
                                    <label>You Save 0</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://google.com">Order Now</a></div>
                                    </div>
                                    <div id="standardterm2" class="desc">
                                    <label>You Save 5%</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://msn.com">Order Now</a></div>
                                    </div>
                                    <div id="standardterm3" class="desc">
                                    <label>You Save 10%</label>
                                    <div class="shared-page-tables-4colmns-button"><a href="http://msn.com">Order Now</a></div>
                                    </div>
                                    <div class="shared-page-tables-4colmns-button" id="initial"><label>You Save $0</label><a href="#">Order Now</a></div>
                        </div> 

HTML:

 

I think its its because of the name attribute. Have you tried changing the name for the two groups into different .

 

yes but nothing is working

 

Uhm... I have some silly questions...

What makes those radio buttons be list items? Why don't they have labels? Where are your fieldsets? Why do you have labels without corresponding form elements (since that's what labels are FOR)? Dragging that markup kicking and screaming into something remotely resembling semantics would probably go a long ways towards making whatever it is you're trying to do simpler...

As to your problem, could you better explain what you want that scripting to actually do as I'm just not getting it. Looks like you're using jquery's stupid show/hide crap for ... well, I'm not even sure what. Like most of the needlessly cryptic jQuery garbage, I get a headache just looking at that mess.

 

if you look in this http://jsfiddle.net/VXK9t/ the code is here
but the problem is how can i separate You Save % and Order now button for each radio group actually "the plans repeats multiple times for 3 time or 4 time and I require these 3 plan terms for each plan please help

 

I ALMOST think I'm grasping what you're trying to do, while at the same time feeling like I'm guessing wildly. I think the problem is your markup doesn't even come CLOSE to what you want to do or how it should be done, and you've violating one of the unwritten rules of good scripting when it comes to forms -- particularly things like order forms... If you can't make the page work without scripting FIRST, you have no business adding scripting to it.

I SUSPECT you should have three separate forms, your anchors should be INPUT[submit], with your radio buttons properly in fieldsets. The only thing I'd have there for a scripting assist would be the % show part, which I'd do by copying a title attribute from the selected input[radio].

Instead you don't even HAVE a form, or submits, and seem to be screwing around with a bunch of scripting for nothing.

Though I'm still not sure I'm even understanding what you are trying to do. Might be a language barrier issue. Might also be I'm not seeing enough of the page -- are there headings/related data to those columns of buttons?!?