JS Implementation tab page different content toggle Display

Effect

The following ideas are implemented:

Controller layer at the same time to the two content of the investigation and management

Front-end HTML with JS control display

(1) Front-end TAB code

(2) Structure of tab content

(3) Key part JS

$ (". HD ul li"). Click (function () {
var index=$ (this). index ();
$ (this). addclass (' on '). Siblings (). Removeclass ("on");
$ (". About-details-pro. BD"). EQ (index). CSS ("Display", "block"). Siblings (". BD"). CSS ("display", "none")
})

JS Implementation tab page different content toggle Display