How to disable some toggle buttons?

JavaScript
1

Hi to everyone… I’m here for a new issue with a jquery code.
I’ve got two div (#a, #b) that have a toggle function and make visible another div (#player) in which is loaded an external file.
Well, I’d like to disable the second div (#b) when the first div (#a) has been clicked and do the same when the second div (#b) has been clicked.

I modified this code (the one that I use usually) with an if/else condition, but it not works


$('#a').click(function() {
  $('#player').toggle('slow', function() {

	if($('#player').is(':visible')) {
	$('#b').attr("disabled", true);
	} else {
	$('#b').attr("disabled", false);}
  });
 });

 $('#b').click(function(e) {
  $('#player').toggle('slow', function() {
    // altre funzioni correlate
	if($('#player').is(':visible')) {
	$('#a').attr("disabled", true);
	} else {
	$('#a').attr("disabled", false);}
  });
  e.preventDefault();
 });

$ ('#a a').click(function(e) {
    var url = $(this).attr('href')
   $('#player').html('loading...').load(url,function(){
		
   });
   e.preventDefault();
});	
	
$ ('#b a').click(function(e) {
    var url = $(this).attr('href')
   $('#player').html('loading...').load(url,function(){
		
   });
   e.preventDefault();
});

How can I solve?

Thanks a lot

Paco

2

With a simple test page it seems to work properly.


<div>
  <button id="a">Button a</button>
  <button id="b">Button b</button>
</div>
<div id="player">Player</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
// code here
</script>

Is there something with your HTML that may be preventing things from working as you expect?